Ajax 跨域请求 Cookie 无法携带/保存的解决办法 作者: Chuwen 时间: 2020-03-17 分类: JavaScript 评论 # 服务器端设置 ### Nginx 端设置： > `http://192.168.3.4` 是允许跨域的域名，80和443 可以不用加端口号，除此之外的端口号要加 ``` add_header 'Access-Control-Allow-Origin' 'http://192.168.3.4'; add_header 'Access-Control-Allow-Credentials' 'true'; ``` ### PHP 端设置： > 解释同上 ``` header("Access-Control-Allow-Origin: http://192.168.3.4"); header("Access-Control-Allow-Credentials: true"); ``` # 前端设置 ### jQuery Ajax 请求： ``` $.ajax({ url: 'http://nas/api/v2/sync/maindata', xhrFields: { // 允许携带证书 withCredentials: true }, dataType: 'json', success: function (res) { console.log("请求结果："+res); } }); ```
PHP设置允许AJAX跨域请求 作者: Chuwen 时间: 2018-01-04 分类: PHP 评论 # 1. 跨域请求 > 跨源资源共享（CORS）是一种机制，它使用额外的HTTP标头，让用户代理获得访问来自不同来源（域）的服务器上选定资源的权限，而不是使用当前正在使用的站点。用户代理在请求来自与当前文档不同的域，协议或端口的资源时发出 **跨源HTTP请求**。 ### `以下内容` 引用自 什么是JS跨域访问？ - 黄家兴的回答 - 知乎 <a href="https://www.zhihu.com/question/26376773/answer/244453931?href=https://NowTime.cc" target="_blank" >https://www.zhihu.com/question/26376773/answer/244453931 </a>，有删改 > ## 1-2. 浏览器的同源策略会导致跨域，这里同源策略又分为以下两种 > 1. `DOM` 同源策略：禁止对不同源页面 `DOM` 进行操作。这里主要场景是 `iframe` 跨域的情况，不同域名的 `iframe` 是限制互相访问的。 > 2. `XmlHttpRequest` 同源策略：禁止使用 `XHR` 对象向不同源的服务器地址发起 `HTTP` 请求。 > > ## 1-3. 为什么要有跨域限制 > ### 1-3-1. AJAX同源策略主要用来防止CSRF攻击。如果没有AJAX同源策略，相当危险，我们发起的每一次HTTP请求都会带上请求地址对应的cookie，那么可以做如下攻击： > 1. 用户登录了自己的银行页面 http://mybank.com，http://mybank.com 向用户的cookie中添加用户标识。 > 2. 用户浏览了恶意页面 http://evil.com。执行了页面中的恶意AJAX请求代码。 > 3. http://evil.com 向 http://mybank.com 发起AJAX HTTP请求，请求会默认把 http://mybank.com 对应cookie也同时发送过去。 > 4. 银行页面从发送的 cookie 中提取用户标识，验证用户无误，response 中返回请求数据。此时数据就泄露了。 > 5. 而且由于Ajax在后台执行，用户无法感知这一过程。 > > ### 1-3-2. DOM同源策略也一样，如果iframe之间可以跨域访问，可以这样攻击： > 1. 做一个假网站，里面用iframe嵌套一个银行网站 http://mybank.com。 > 2. 把iframe宽高啥的调整到页面全部，这样用户进来除了域名，别的部分和银行的网站没有任何差别。 > 3. 这时如果用户输入账号密码，我们的主网站可以跨域访问到http://mybank.com的dom节点，就可以拿到用户的输入了，那么就完成了一次攻击。 > > #### 所以说有了跨域跨域限制之后，我们才能更安全的上网了。 # 2. 允许跨域 ## 2-1. 在服务端设置 `header` 头允许跨域 ```php <?php //1. 允许 https://nowtime.cc 发起的跨域请求 header("Access-Control-Allow-Origin: https://nowtime.cc"); //2. 如果需要设置允许所有域名发起的跨域请求，可以使用通配符 `*` //这样做虽然很方便，但在一些场景会出现一些安全问题，建议使用上面那种方法，并加上一些业务逻辑，例如判断 Request Headers 中的 Origin header("Access-Control-Allow-Origin: *"); ```