浏览器的同源策略

什么是同源策略

同源策略是一个重要的安全策略，它用于限制一个origin（源）的文档或者它加载的脚本如何能与另一个源的资源进行交互。它能帮助阻隔恶意文档，减少可能被攻击的媒介。

什么是同源

浏览器的源由用于访问它的 URL 的方案（协议（protocol））、主机名（域名（port））和端口（host）定义。只有当协议、主机和端口都匹配时，两个对象才具有相同的源, 则这两个 URL 是同源.

下面给出了与 URL http://store.company.com/dir/page.html 的源进行对比的示例：

URL	结果	原因
http://store.company.com/dir2/other.html	同源	只有路径不同
http://store.company.com/dir/inner/another.html	同源	只有路径不同
https://store.company.com/secure.html	失败	协议不同
http://store.company.com:81/dir/etc.html	失败	端口不同 ( http:// 默认端口是 80)
http://news.company.com/dir/other.html	失败	主机不同

跨域

CORS全称Cross-Origin Resource Sharing，意为跨域资源共享。当一个请求url的协议,域名,端口三者之间任意一个与当前的url不同都即为跨域。跨域不一定会产生跨域问题，只有当一个资源去访问另一个不同域名或者同域名不同端口的资源时，如果此时另一个资源不允许其进行跨域资源访问，那么访问就会遇到跨域问题。

跨域时浏览器会正常发送请求给服务器，服务器会进行正常响应，将响应结果发送给浏览器，如果是跨域，此时浏览器会对响应进行校验，只有在校验不通过时，才会引发错误，从而产生跨域问题。
注意：
跨域问题源自于浏览器的同源策略，服务器与服务器之间通信不会有跨域。
跨域不只是在发生ajax过程中，只要不是同源请求都是跨域。比如用
<script>、< link>、<img>等嵌入跨源的资源。

跨域解决方法

1.CORS方式

CORS （跨源资源共享） 是 HTTP 的一部分，它允许服务端来指定哪些主机可以从这个服务端加载资源。现在的主流的浏览器都支持cors的方式.。
CORS 通过一种机制来允许服务器声明哪些源站通过浏览器有权限访问哪些资源，该机制通过浏览器发起一个到服务器托管的跨源资源的“预检”请求。在预检中，浏览器发送的头中标示有 HTTP 方法和真实请求中会用到的响应头。
所以，如果需要跨域, 则需要配置响应头信息，标识是否允许。

对于简单请求来说，不会触发 CORS 预检。
HEAD、GET、POST 被视为简单请求。
简单请求HTTP 的头信息不超出以下几种字段：（不适用于Fetch ）

• Accept
• Accept-Language
• Content-Language
• Last-Event-ID
• Content-Type：只限于三个值 application/x-www-form-urlencoded、multipart/form-data、text/plain

会触发 CORS 预检的非简单请求（比如说请求方法是 PUT 或 DELETE，或者 Content-Type 字段的类型是 application/json，或者请求消息头包含了一些自定义的字段）

非简单请求在正式通信之前，会增加一次 HTTP 查询请求，称为“预检”请求。预检请求通过后，才会返回正常的响应内容。

2.ajax的jsonp

利用 <script> 元素的这个开放策略，网页可以得到从其他来源动态产生的 JSON 资料。

3. nginx

nginx实现跨域的原理，实际就是把web项目和后端接口项目放到一个域中，这样就不存在跨域问题，然后根据请求地址去请求不同服务器（真正干活的服务器。