发布日期:2018 年 11 月 5 日
浏览器的同源政策会阻止读取来自不同来源的资源。此机制可阻止恶意网站读取其他网站的数据,但也会阻止合法使用。
现代 Web 应用通常需要从不同来源获取资源,例如从不同网域检索 JSON 数据,或将其他网站的图片加载到 <canvas> 元素中。这些资源可能是公开资源,应供任何人读取,但同源政策会阻止使用这些资源。开发者过去一直使用
JSONP等变通方法。
跨源资源共享 (CORS) 以标准化方式解决了此问题。 启用 CORS 后,服务器可以告知浏览器可以使用其他来源。
Web 上的资源请求是如何运作的?
浏览器和服务器可以使用超文本传输协议 (HTTP) 通过网络交换数据。HTTP 定义了请求者和响应者之间的通信规则,包括获取资源所需的信息。
HTTP 标头用于协商客户端和服务器之间的消息交换,并用于确定访问权限。浏览器的请求和 服务器的响应消息都分为标头和正文两部分。
标头
有关消息的信息,例如消息的类型或消息的编码。标头可以包含以键值对形式表示的 各种信息 。请求标头和响应标头包含不同的信息。
请求标头示例
Accept: text/html
Cookie: Version=1
此标头相当于说“我希望收到 HTML 格式的响应。这是我拥有的 Cookie。”
响应标头示例
Content-Encoding: gzip
Cache-Control: no-store
此标头相当于说“此响应中的数据采用 gzip 编码。请勿缓存此数据。”
正文
消息本身。可以是纯文本、图片二进制文件、JSON、HTML 或许多其他格式。
CORS 的运作方式
同源政策会告知浏览器阻止跨源请求。当您需要来自不同来源的公开资源时,提供资源的服务器会告知浏览器,发送请求的来源可以访问其资源。浏览器会记住这一点,并允许该资源的跨源资源共享。
第 1 步:客户端(浏览器)请求
当浏览器发出跨源请求时,浏览器会添加一个 Origin 标头,其中包含当前来源(架构、主机和端口)。
第 2 步:服务器响应
当服务器看到此标头并想要允许访问时,它会在响应中添加一个 Access-Control-Allow-Origin 标头,以指定请求来源(或使用 * 允许任何来源)。
第 3 步:浏览器收到响应
当浏览器看到包含相应 Access-Control-Allow-Origin 标头的响应时,它会与客户端网站共享响应数据。
使用 CORS 共享凭据
出于隐私考虑,CORS 通常用于匿名请求,即请求者未被识别。如果您想在使用 CORS 时发送 Cookie(可以识别发送者),则需要在请求和响应中添加其他标头。