F's Blog

博客 收藏夹
CROS

07 Jan 2018

CORS 是一个 W3C 标准,全称是跨域资源共享(Cross-origin resource sharing)。它允许浏览器向跨源服务器,发出 XMLHttpRequest 请求,从而克服了 AJAX 只能同源使用的限制。

为了实现跨域,需要服务器的支持。一个是如 Nginx 这样的静态服务器,一个是如 Rails 这样的应用服务。

但结果都是一样,要在返回的 HTTP 头里加入特定的信息。

Response Header:

假设您的应用已经在 example.com 上了,而您想要从 www.example2.com 提取数据。

一般情况下,如果您尝试进行这种类型的AJAX调用,请求将会失败,而浏览器将会出现源不匹配的错误。 利用 CORS 后只需 www.example2.com 服务端添加一个 HTTP Response 头,就可以允许来自 example.com 的请求。

将 Access-Control-Allow-Origin 添加到某网站下或整个域中的单个资源:

Access-Control-Allow-Origin: http://example.com
Access-Control-Allow-Credentials: true (可选)

将允许任何域向您提交请求:

Access-Control-Allow-Origin: *
Access-Control-Allow-Credentials: true (可选)

对于简单请求,如GET,只需要在HTTP Response后添加Access-Control-Allow-Origin。

对于非简单请求,比如POST、PUT、DELETE等,浏览器会分两次应答。第一次preflight(method: OPTIONS),主要验证来源是否合法,并返回允许的Header等。第二次才是真正的HTTP应答。所以服务器必须处理OPTIONS应答。

参考

本文由 付豪 创作,采用署名 4.0 国际(CC BY 4.0)创作共享协议进行许可,详细声明