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使得配置生效喔!

实测可行:

配置成功

扫描二维码关注公众号,回复: 16649899 查看本文章

猜你喜欢

转载自blog.csdn.net/weixin_52027058/article/details/126561827