浏览器-跨域

同源

1995 年，同源政策由 Netscape 公司引入浏览器。目前，所有浏览器都实行这个政策。同源（即指在同一个域）就是两个页面具有相同的协议（protocol），主机（host）和端口号（port）。可以说 Web 是构建在同源策略基础之上的，浏览器只是针对同源策略的一种实现。同源策略会阻止一个域的 javascript 脚本和另外一个域的内容进行交互。

跨域

当一个请求 url 的协议、域名、端口三者之间任意一个与当前页面 url 不同即为跨域

http://www.example.com/dir2/other.html：同源
https://www.example.com/dir2/other.html：不同源（协议不同）
http://example.com/dir/other.html：不同源（域名不同）
http://v2.www.example.com/dir/other.html：不同源（域名不同）
http://www.example.com:81/dir/other.html：不同源（端口不同）

随着互联网的发展，”同源政策”越来越严格。目前，如果非同源，共有三种行为受到限制：

• Cookie、LocalStorage 和 IndexDB 无法读取。
• DOM 无法获得。
• AJAX 请求不能发送。

JSONP

JSONP 是服务器与客户端跨源通信的常用方法。最大特点就是简单适用，兼容性好（兼容低版本 IE），缺点是只支持 get 请求，不支持 post 请求。

核心思想：网页通过添加一个 script 元素，向服务器请求 JSON 数据，服务器收到请求后，将数据放在一个指定名字的回调函数的参数位置传回来。

CORS

CORS 是跨域资源分享（Cross-Origin Resource Sharing）的缩写。它是 W3C 标准，属于跨源 AJAX 请求的根本解决方法。

浏览器将 CORS 请求分成两类：简单请求（simple request）和非简单请求（not-so-simple request）。 只要同时满足以下两大条件，就属于简单请求。

1. 请求方法是以下三种方法之一：
   • HEAD
   • GET
   • POST
2. HTTP 的头信息不超出以下几种字段：
   • Accept
   • Accept-Language
   • Content-Language
   • Last-Event-ID
   • Content-Type：只限于三个值 application/-
   • x-www-form-urlencoded、multipart/form-data、text/plain

凡是不同时满足上面两个条件，就属于非简单请求。

非简单请求

非简单请求是那种对服务器有特殊要求的请求，比如请求方法是 PUT 或 DELETE，或者 Content-Type 字段的类型是 application/json。

非简单请求的 CORS 请求，会在正式通信之前，增加一次 HTTP 查询请求，称为”预检”请求（preflight）。

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