携手创作，共同成长！这是我参与「掘金日新计划 · 8 月更文挑战」的第8天，点击查看活动详情

同源策略限制

浏览器同源策略

• 限制从一个源加载的文档或脚本如何与来自另一个源的资源进行交互
• 源：协议、域名、端口号必须完全相同(任何一部分不同就不同源，就是跨域)
• 限制：一个源的文档没有权利去操作另一个源的文档。这个限制体现在：cookie

一种约定，安全策略。协议、域名、端口号相同。非同源的客户端脚本在没有明确授权的情况下不能读写对方资源，请求数据会拒绝访问。

非同源限制: 不能读取cookie、无法获得dom、不能发送ajax LocalStorage 和 IndexDB 无法获取； 无法获取和操作 DOM； 不能发送Ajax请求

1. 1XX: 服务器收到请求，需要请求者继续操作
2. 2XX: 成功
3. 3XX: 重定向，需要进一步的操作以完成请求
4. 4XX: 客户端错误
5. 5XX: 服务器错误

AJAX 默认遵循同源策略
    同源：协议、域名、端口号 必须完全相同
    违背同源策略就是跨域        

跨域

跨域问题是浏览器对于Ajax 请求的一种安全限制：一个页面发起Ajax 请求。只能是相对于当前页同域名的路径。这可以有效的阻止跨站攻击。

跨域解决方法

• JSONP跨域方案：

1. 非正式传输协议,只支持get请求。
2. 利用script 标签的跨域能力来发送请求的script标签的 src 属性没有跨域限制。使用script 标签进行跨域请求，并在响应中返回要执行的script 代码。里面可以直接使用 JSON 传递JavaScript 对象，这种跨域的方式称为JSONP。

• CORS 跨域资源共享：

1. 官方的跨域解决方案，不需要在客户端做任何特殊操作，完全在服务器进行处理，支持get、post、head请求。
2. CORS需要浏览器、服务器同时支持，才能实现跨域。
3. 在 header 中加入 origin 请求字段，服务器端：响应头中， 设置 “Access-Control-Allow-Origin“ “可接受的域”。是一个具体域名或者 * ，代表任意源文件。

• iframe框架

1. 通过window.name + iframe，window.name属性的独特之处：name值在不同的页面（甚至不同域名）加载后依旧存在，并且可以支持非常长的 name 值（2MB）。
2. iframe的src属性由外域转向本地域，跨域数据即由iframe的window.name从外域传递到本地域。这个就巧妙地绕过了浏览器的跨域访问限制，但同时它又是安全操作。