关于跨域请求

2018-07-26  本文已影响0人  寿司炸鸡女朋友

同源策略/SOP(Same origin policy)是一种约定,由Netscape公司1995年引入浏览器,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,浏览器很容易受到XSS、CSFR等攻击。所谓同源是指"协议+域名+端口"三者相同,即便两个不同的域名指向同一个ip地址,也非同源。

由于浏览器的 同源策略 ,前端请求不同源(协议、端口、域名不同)的接口时会被拦截。

http://www.a.com向http://www.b.com发送请求。
由于域名不同,浏览器会拦截a域名向b域名的请求。
在开发者工具的Network中可以看到,向b服务器的请求能发送成功并收到请求结果
但在js中是无法对请求后的结果做处理,而且Console中也能看到该请求的错误信息

上面例子中无法处理请求结果和console展示的错误信息就是 同源策略 导致的。

而现在非常流行的前后端分离的开发方式,很多情况下前端页面和后端API都会是不同的域名指向。这就肯定会涉及到 同源策略 导致的请求结果无法处理。这里说一下通过在PHP下配置的方式来解决这个问题。

通过观察 Console 中的报错信息能比较容易的解决跨域问题。

在响应头中设置 Access-Control-Allow-Origin ,表示允许哪些域名的脚本访问该资源。

//表示允许所有域名的脚本访问该资源。
Access-Control-Allow-Origin:*
//表示允许http://www.b.com域名下的脚本访问该资源。
Access-Control-Allow-Origin:http://www.b.com

有时候不单只需要设置允许的域名,还需要设置允许的 HTTP请求方式

Access-Control-Allow-Methods:POST,GET,PUT,DELETE,OPTIONS

设置请求头中允许的自定义参数

//表示允许请求头中加入 Authorization 参数
Access-Control-Allow-Headers:Authorization

参考:https://segmentfault.com/a/1190000011145364#articleheader0

上一篇下一篇

猜你喜欢

热点阅读