Nginx使用经验之支持跨域

使用背景

之前在公司搭建了一台fastdfs文件服务器，使用一直正常。但某天一个前端同事反馈，使用中遇到个问题：
他用一个插件获取文件服务器上的文件，却报了异常–Access to fetch at 'http://ip:port/xx/M00/00/00/abc.pdf' from origin 'null' has been blocked by CORS policy: request's mode to 'no-cors' to fetch the resource with CORS disabled.
显然，异常表明这是文件服务器上的nginx不支持跨域访问导致的。尽管其它前端应用在跨域访问文服上的文件时都是正常的，但本着尊重异常提示的原则，仍然尝试在我这边的nginx上去解决掉此问题

解决方案

在代理的location上增加一段支持跨域的配置，如下：

location /xx/M00/ {
	#新增的配置，用以支持跨域访问
	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-Control-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;
	}
	#原来的配置
	proxy_pass http://31.48.120.21:8888/xx/M00/;
	proxy_redirect default;
}

大致解释一下：

• Access-Control-Allow-Origin，指定允许其他域名访问，这里使用变量 $http_origin取得当前来源域
• Access-Control-Allow-Credentials，是否允许后续请求携带认证信息（cookies）
• Access-Control-Allow-Methods，OPTIONS一定要有的，另外一般也就GET和POST，如果你有其它的也可加进去
• Access-Control-Allow-Headers，这个要注意，里面一定要包含自定义的http头字段（就是说前端请求接口时，如果在http头里加了自定义的字段，这里配置一定要写上相应的字段）
• Access-Control-Expose-Headers，可不设置，看网上大致意思是默认只能获取返回头的6个基本字段，要获取其它额外的，先在这设置才能获取它
• 语句“ if ($request_method = 'OPTIONS') {}”，这是关键。因为浏览器判断是否允许跨域时会先往后端发一个 options
  请求，然后根据返回的结果判断是否允许跨域请求，所以这里单独判断这个请求，然后直接返回204（204指成功但无需跳转）；

经验证，该配置成功解决掉上述问题

参考文章

https://blog.youkuaiyun.com/envon123/article/details/83270277