允许跨域资源共享(CORS)携带 Cookie

分享于2021年05月12日 跨域
CORS 是一个 W3C 标准,全称是“跨域资源共享”(Cross-origin resource sharing)。
默认浏览器为了安全,遵循“同源策略”,不允许 Ajax 跨域访问资源,而为了允许这种操作,服务器端和客户端都要遵循一些约定。

服务器端需设置以下响应头:


Access-Control-Allow-Origin: <origin> | * // 授权的访问源
Access-Control-Max-Age: <delta-seconds> // 预检授权的有效期,单位:秒 
Access-Control-Allow-Credentials: true | false // 是否允许携带Cookie 
Access-Control-Allow-Methods: <method>[, <method>]* // 允许的请求方法 
Access-Control-Allow-Headers: <field-name>[, <field-name>]* // 额外允许携带的请求头 
Access-Control-Expose-Headers: <field-name>[, <field-name>]* // 额外允许访问的响应头

Access-Control-Allow-Credentials 响应头会使浏览器允许在 Ajax 访问时携带 Cookie,但是如果ajax跨域请求的时候携带了cookie,那么 Access-Control-Allow-Origin 将不能使用通配符*,而且只能指定一个源, 且 Access-Control-Allow-Methods和Access-Control-Allow-Headers 以及 Access-Control-Expose-Headers 都不能使用通配符,但是可以指定多个值,以逗号分隔。 


jquery ajax请求的时候要携带cookie,使用如下代码:

$.ajax({
    url: "http://localhost:8080/orders",
    type: "GET",
    xhrFields: {
        withCredentials: true
    },
    success: function (data) {
        render(data);
    }
});