脚本之家 服务器常用软件
快捷导航
您的位置：首页 → 网站技巧 → 服务器 → nginx → nginx已经配置过跨域不生效

解决nginx已经配置过跨域不生效问题

 更新时间：2023年12月22日 09:03:50   作者：空城旧梦丨  
这篇文章主要介绍了解决nginx已经配置过跨域不生效的问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教

nginx已经配置过跨域不生效问题

前端访问后台时提示跨域

服务器nginx配置如下

server {    
	listen       80;
	server_name  xxxxxx.com;

	location / {
		proxy_pass http://localhost:8061/;
		proxy_set_header   Host             $host;
		proxy_set_header   X-Real-IP        $remote_addr;
		proxy_set_header   X-Forwarded-For  $proxy_add_x_forwarded_for;
	}
	
       add_header Access-Control-Allow-Origin *;
       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,token,platform;
       add_header Access-Control-Allow-Methods GET,POST,OPTIONS,HEAD,PUT;
       add_header Access-Control-Allow-Credentials true;
  
       proxy_set_header x-real-ip $remote_addr;
       proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;


	access_log /var/log/nginx/api-access.log;
	error_log  /var/log/nginx/api-error.log;

}

很多文章都是说要加上

add_header Access-Control-Allow-Origin *;

但事实证明我这里已经配置了，还是报跨域，经过查询后发现关键点在这里

 if ( $request_method = 'OPTIONS' ) { 
       return 200;
  }

最终的配置就是

server {    
	listen       80;
	server_name  xxxxxx.com;

	location / {
		proxy_pass http://localhost:8061/;
		proxy_set_header   Host             $host;
		proxy_set_header   X-Real-IP        $remote_addr;
		proxy_set_header   X-Forwarded-For  $proxy_add_x_forwarded_for;
	}
	
       add_header Access-Control-Allow-Origin *;
       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,token,platform;
       add_header Access-Control-Allow-Methods GET,POST,OPTIONS,HEAD,PUT;
       add_header Access-Control-Allow-Credentials true;
  
       proxy_set_header x-real-ip $remote_addr;
       proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;

	   if ( $request_method = 'OPTIONS' ) { 
		     return 200;
		}

	access_log /var/log/nginx/api-access.log;
	error_log  /var/log/nginx/api-error.log;

}

因为 post 请求 浏览器会发送一个 options 的预检请求，主要将本次的请求头 发送给服务端，若服务端允许，再发送真正的post请求，所以 f12 看到，经常 post 会发送两次请求。

因为后端 java 代码没有对 options 请求做出处理，导致 options 接口请求的时候，报 403 forbidden , 这里 nginx 对 options 的请求直接返回 200，不用到达接口层，直接允许 post 响应头，即可使得上述失效配置能够生效

总结

以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。 

您可能感兴趣的文章:

相关文章

最新评论