【核心基础知识】浏览器同源策略与跨域方案

一、浏览器的同源策略（Same Origin Policy）

源（Origin）是由 URL 中协议、主机名（域名 domain）以及端口共同组成的部分。

如果两个 URL 的源相同，我们就称之为同源。不同源的情况有以下几种：

• 协议不同。比如：http：//www.baidu.com与https：//www.baidu.com，http与https协议不同。
• 主机名不同。比如：http://www.baidu.com与http://sp2.baidu.com。如果是ip地址也是同理。
• 端口不同。比如：http://192.168.5.24:8080与http://192.168.5.24:8083。

当一个源访问另一个源的资源时就会产生跨源。同源策略就是用来限制其中一些跨源访问的，包括访问 iframe 中的页面、其他页面的 cookie 访问以及发送 AJAX 请求。最常见的跨源场景是域名不同，即常说的“跨域”。本课时也按照约定俗成的说法，用“跨域”来指代“跨源”。

同源策略在保障安全的同时也带来了不少问题，比如 iframe 中的子页面与父页面无法通信，浏览器与其他服务端无法交互数据。所以我们需要一些跨域方案来解决这些问题。

二、请求跨域解决方案

对于浏览器请求跨域，常用的有下面 4 种方法。

1、跨域资源共享

跨域资源共享（CORS，Cross-Origin Resource Sharing）是浏览器为 AJAX 请求设置的一种跨域机制，让其可以在服务端允许的情况下进行跨域访问。主要通过 HTTP 响应头来告诉浏览器服务端是否允许当前域的脚本进行跨域访问。

跨域资源共享