跨域问题的相关整理

跨域问题的相关整理

一、什么是跨域？

跨域是指一个域下的文档或者脚本试图去请求另一个域下的资源。

(一)广义下的跨域

1. 资源跳转：A链接、重定向、表单提交
2. 资源嵌入： <link>、<script>、<img>等dom标签，样式中background:url()、@font-face()等文件外链
3. 脚本请求： js发起的ajax请求、dom和js对象的跨域操作等

(二)狭义下的跨域

狭义下的跨域，是指浏览器不能执行其他网站的脚本。这是浏览器的同源策略限制造成的，是浏览器保证网站安全的一种手段。只有与当前网页同源的javaScript脚本才能执行。

(三)同源策略

同源策略限制了从同一个源加载的文档或脚本如何与来自另一个源的资源进行交互。查看同源策略-MDN

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

同源策略限制的几种行为

1. Cookie、LocalStorage 和 IndexedDB 无法读取

   访问存储在浏览器中的数据，如 localStorage 和 IndexedDB，是以源进行分割。每个源都拥有自己单独的存储空间，一个源中的 JavaScript 脚本不能对属于其它源的数据进行读写操作

   Cookies 使用不同的源定义方式。一个页面可以为本域和其父域设置 cookie

2. DOM 和 Js对象无法获得

3. AJAX 请求不能发送

同源的定义

与 URL http://www.domain.com/a.js 的源进行对比的示例

URL	说明	通信
http://www.domain.com/lab/c.js	同一域名，不同文件或路径	允许
http://www.domain.com:8000/a.js	不同端口	不允许
https://www.domain.com/b.js	不同协议	不允许
http://192.168.4.12/b.js	域名与ip地址	不允许
http://x.domain.com/b.js	主域相同，子域不同	不允许
http://www.domain2.com/b.js	不同域名	不允许

二、跨域解决方案

(一)跨域资源共享(CORS)