前端跨域请求-403

1.angular前端跨域请求

this.$http({
       method: 'POST',
       url: Url,
       data:param,
       headers: { 'Access-Control-Allow-Origin':'*','Content-Type':'application/json;charset=UTF-8'}
       })

 

前端设置请求头'Access-Control-Allow-Origin':'*', 但仍旧报错403，而且post变成options请求，console报错preflight request跨域。

网游一圈，发现了这个 post请求变为options请求，并返回错误代码403的解决方案，

跟我的情况一致，遂解决。

综上所述原因为：

跨域CORS 请求中分为两类：简单请求（simple request）和非简单请求（not-so-simple request）。

在非简单请求中，浏览器会在正式通信之前，增加一次 HTTP 查询请求（OPTIONS请求），称为“预检”请求（preflight）。

预检请求就是在跨域请求中，会在正式的请求前先询问服务器，当前网页所在的域名是否在服务器的许可名单之中，以及可以使用哪些 HTTP 动词和头信息字段。只有得到肯定答复，浏览器才会发出正式的XMLHttpRequest请求，否则就报错。

这是为了防止这些新增的请求，对传统的没有 CORS 支持的服务器形成压力，给服务器一个提前拒绝的机会，这样可以防止服务器大量收到DELETE和PUT请求，这些传统的表单不可能跨域发出的请求。

解决方法：

后端做一层拦截，判断这个是不是options请求，判断一下来源，确认过眼神，是个预检请求，返回200就可以了。