Nginx解决前端跨域问题CORS跨域配置
Nginx的CORS配置，⽹上太多这配置了，但⼤家更多的复制粘贴、转发，⼏乎都是类似下⾯这三两⾏：
add_header Access-Control-Allow-Origin *;add_header Access-Control-Allow-Headers X-Requested-
With;add_header Access-Control-Allow-Methods GET,POST,OPTIONS;
这样有⽤么？有⽤，我以前这样使⽤也正常过，但后来还是遇到问题了，发现有些项⽬请求就不成功，也遇到有些浏览器成功，有些浏览器不成功；
我也在⽹上查各种资料和调整写法，最后我调整好的写法，基本的使⽤没问题，我在项⽬中也⼀直使⽤着！
下⾯发⼀段我实际项⽬中的部分配置：
跨域相关的配置，主要是下⾯这部分：
add_header 'Access-Control-Allow-Origin' $http_origin;add_header 'Access-Control-Allow-Credentials'
'true';add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';add_header 'Access-Contro
l-Allow-Headers' 'DNT,web-token,app-token,Authorization,Accept,Origin,Keep-Alive,User-Agent,X-Mx-ReqToken,X-Data-Type,X-Auth-Token,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range';add_header 'Access-Control-Expose-Headers' 'Content-Length,Content-Range';if ($request_method = 'OPTIONS') {add_header 'Access-Control-Max-Age' 1728000;add_header 'Content-Type' 'text/plain; charset=utf-8';add_header 'Content-Length' 0;return 204;}
下⾯简单讲解⼀下，以便⼤家配置成功！
1、Access-Control-Allow-Origin，这⾥使⽤变量 $http_origin取得当前来源域，⼤家说⽤“*”代表允许所有，我实际使⽤并不成功，原因未知；
2、Access-Control-Allow-Credentials，为 true 的时候指请求时可带上Cookie，⾃⼰按情况配置吧；
3、Access-Control-Allow-Methods，OPTIONS⼀定要有的，另外⼀般也就GET和POST，如果你有其它的也可加进去；
4、Access-Control-Allow-Headers，这个要注意，⾥⾯⼀定要包含⾃定义的http头字段（就是说前端请求接⼝时，如果在http头⾥加了⾃定义的字段，这⾥配置⼀定要写上相应的字段），从上⾯可看到我
写的⽐较长，我在⽹上搜索⼀些常⽤的写进去了，⾥⾯有“web-token”和“app-token”，这个是我项⽬⾥前端请求时设置的，所以我在这⾥要写上；
5、Access-Control-Expose-Headers，可不设置，看⽹上⼤致意思是默认只能获返回头的6个基本字段，要获取其它额外的，先在这设置才能获取它；
6、语句“ if ($request_method = 'OPTIONS') { ”，因为浏览器判断是否允许跨域时会先往后端发⼀个 options 请求，然后根据返回的结果判断是否允许跨域请求，所以这⾥单独判断这个请求，然后直接返回；
>nginx部署前端项目

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。