nginx设置add_header失效配置cors跨域失效无效的解决方案-Toy模板网

这篇具有很好参考价值的文章主要介绍了nginx设置add_header失效配置cors跨域失效无效的解决方案。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

希望对大家有帮助，有用的话记得点个赞评个论，让俺知道这个法子可以帮助到大家哟！（虽然我这个法子很野）

起因

最近在完成一个项目，后端API地址和前端地址不一致，这就涉及到了跨域的问题。

由于服务端加了一层Nginx作为反代，所以很自然的想到要去.conf配置文件中加几句add_header：


location XXXX {
    # 此处省略一万字
    #CORS 配置
    add_header 'Access-Control-Allow-Origin' '*';
    add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS, PUT, DELETE';
    #是否允许cookie传输
    add_header 'Access-Control-Allow-Credentials' 'true';
    add_header 'Access-Control-Allow-Headers' 'Authorization,Content-Type,Accept,Origin,User-Agent,DNT,Cache-Control,X-Mx-ReqToken,X-Data-Type,X-Requested-With,X-Data-Type,X-Auth-Token';
    #针对浏览器的options预请求直接返回200，否则会被403 forbidden--invalie CORS request
    if ( $request_method = 'OPTIONS' ) { 
		  return 200;
	  } 
    # 此处省略一万字
}

但是，但是！在保存完配置，重启Nginx之后，发现自己加上来的add_header语句并没有起作用！

翻了很多资料，有说是继承问题，但是我排查了老一阵子，也没发现哪儿有继承问题。我自己用宝塔部署的，那里面配置文件一层层include的看着就烦！晕！一眨眼一夜没了！

不过，在一番瞎尝试之中，偶然发现了一个可行的方案——

我自己试着行的解决方案

那就是——套一层if语句！

更改后的配置如下：

    set $enable_cors 0;
    if ( $enable_cors = 0 )
    {
    #CORS 配置
    add_header 'Access-Control-Allow-Origin' '*';
  	add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS, PUT, DELETE';
	#是否允许cookie传输
    add_header 'Access-Control-Allow-Credentials' 'true';
	add_header 'Access-Control-Allow-Headers' 'Authorization,Content-Type,Accept,Origin,User-Agent,DNT,Cache-Control,X-Mx-ReqToken,X-Data-Type,X-Requested-With,X-Data-Type,X-Auth-Token';
    }
    
    
    #针对浏览器的options预请求直接返回200，否则会被403 forbidden--invalie CORS request
    if ( $request_method = 'OPTIONS' ) { 
    #CORS 配置
    add_header 'Access-Control-Allow-Origin' '*';
  	add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS, PUT, DELETE';
	 #是否允许cookie传输
    add_header 'Access-Control-Allow-Credentials' 'true';
	add_header 'Access-Control-Allow-Headers' 'Authorization,Content-Type,Accept,Origin,User-Agent,DNT,Cache-Control,X-Mx-ReqToken,X-Data-Type,X-Requested-With,X-Data-Type,X-Auth-Token';
	return 200;
	}

上面的这段nginx配置，记得贴到对应的location下面哟！
加入之后，一定记得重启下Nginx使得配置生效喔！

实测可行：

nginx add header无效,nginx,前端,http 文章来源地址https://www.toymoban.com/news/detail-520970.html