逆浏览器请求之JS跨域访问

时间 2020-03-16

原文原文链接

禁用跨域访问是浏览器保证安全访问的一项重要策略限制，不少跨域访问的操做都是违逆浏览器标准的。在一些场合不得不又须要用到，则本文大体说明下，在Nginx做为服务端是如何解决跨域访问。跨域

参数解释

一些主要的跨域参数浏览器

Access-Control-Allow-origin # 受权容许来源
Access-Control-Allow-Methods # 受权容许方法
Access-Control-Allow-Headers # 受权容许请求头
Access-Control-Expose-Headers # 可公开响应头
Access-Control-Allow-Credentials # 容许认证 即开放cookie

容许带cookie访问的配置

解释以下配置，容许 http://localhost:8080 整个来源进行访问。安全

Access-Control-Allow-Origin 支持 *，支持多个域名配置如："http://localhost:8080,http://localhost:8081"，用逗号进行隔开。cookie

但此处由于有容许进行认证（受权cookie），即Origin不支持 * 也不支持多个域名配置，仅支持单项域名配置。spa

Access-Control-Allow-Methods 容许GET,POST,OPTIONS请求访问，若是想要支持其余请求将其加入其中。OPTIONS是预检请求，跨域中必需要将其开放。code

Access-Control-Allow-Headers 容许客户端传递的header参数，若是客户端传递的header不在其中，则请求会失败。如需经过Authorization进行校验用户身份，则将Authorization配置到请求头。server

一样，服务端如要返回其余响应头给客户端，也需指定，经过Access-Control-Expose-Headers配置，支持逗号隔开多个参数。域名

Access-Control-Allow-Credentials 容许受权cookie，容许必须为true，不然其它即禁用。it

add_header Access-Control-Allow-Origin "http://localhost:8080";
		add_header Access-Control-Allow-Methods 'GET, POST, OPTIONS';
		add_header Access-Control-Allow-Headers 'DNT,X-Mx-ReqToken,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Authorization';
		add_header Access-Control-Expose-Headers 'Authorization';
		add_header Access-Control-Allow-Credentials 'true';

容许任何域名带cookie访问

此操做安全极低，如须要可以下配置。io

set $origin $http_origin;
if ( $origin = '' ) {
	set $origin "$scheme://$host:$server_port";
}
add_header Access-Control-Allow-Origin "$origin";