🔥码云GVP开源项目 12k star Uniapp+ElementUI 功能强大 支持多语言、二开方便! 广告
1. 无关Cookie跨域Ajax请求 客户端 以 Jquery 的 ajax 为例: ``` $.ajax({ url : 'http://remote.domain.com/corsrequest', data : data, dataType: 'json', type : 'POST', crossDomain: true, contentType: "application/json", // POST时必须 ... ``` 主要注意的是参数 crossDomain: true。发送Ajax时,Request header 中会包含跨域的额外信息,但不会含cookie。 服务器端 跨域的允许主要由服务器端控制。服务器端通过在响应的 header 中设置 Access-Control-Allow-Origin 及相关一系列参数,提供跨域访问的允许策略。相关参数的设置介绍,可参见 [Access_control_CORS] 以Java为例: ``` /** * Spring Controller中的方法: */ @RequestMapping(value = "/corsrequest") @ResponseBody public Map<String, Object> mainHeaderInfo(HttpServletResponse response) { response.setHeader("Access-Control-Allow-Origin", "*"); ... } ``` 通过在响应 header 中设置 ‘*’ 来允许来自所有域的跨域请求访问。 `response.setHeader("Access-Control-Allow-Origin", "*");` 只允许来自特定域 http://my.domain.cn:8080 的跨域访问 `response.setHeader("Access-Control-Allow-Origin", "http://my.domain.cn:8080");` 较灵活的设置方式,允许所有包含 mydomain.com 的域名访问. ``` if(request.getHeader("Origin").contains("mydomain.com")) { response.setHeader("Access-Control-Allow-Origin", request.getHeader("Origin")); } ``` 2. 带Cookie的跨域Ajax请求 客户端 ``` $.ajax({ url : 'http://remote.domain.com/corsrequest', data : data, dataType: 'json', type : 'POST', xhrFields: { withCredentials: true }, crossDomain: true, contentType: "application/json", ... ``` 通过设置 withCredentials: true ,发送Ajax时,Request header中便会带上 Cookie 信息。 服务器端 相应的,对于客户端的参数,服务器端也需要进行设置: /** * Spring Controller中的方法: */ @RequestMapping(value = "/corsrequest") @ResponseBody public Map<String, Object> getUserBaseInfo(HttpServletResponse response) { if(request.getHeader("Origin").contains("woego.cn")) { response.setHeader("Access-Control-Allow-Origin", request.getHeader("Origin")); } response.setHeader("Access-Control-Allow-Credentials", "true"); ... } 对应客户端的 xhrFields.withCredentials: true 参数,服务器端通过在响应 header 中设置 Access-Control-Allow-Credentials = true 来运行客户端携带证书式访问。通过对 Credentials 参数的设置,就可以保持跨域 Ajax 时的 Cookie。这里需要注意的是: 服务器端 Access-Control-Allow-Credentials = true时,参数Access-Control-Allow-Origin 的值不能为 '*' 。 ———————————————— 版权声明:本文为CSDN博主「魏文娟」的原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接及本声明。 原文链接:https://blog.csdn.net/weiwenjuan0923/article/details/80113178