最近在一个项目中遇到网站跨域访问的问题，花了半天时间来研究，并记录一下：
问题：
两个网站，A网站需要调用B网站的restful API，B网站采用oauth2.0 进行授权，所以A网站在访问B网站时，需要在请求头中加入Authorization: bear token。
解决方案1-添加跨域注解：
B网站是一个Spring Boot项目，可以在B网站中对需要进行跨域访问的API加入CrossOrigin注解
@CrossOrigin("*")
@RequestMapping("/user")
class UserController {
}
这种方案最简单，但是需要修改源代码，并重新部署。因为我们使用了Nginx作为反向代理，所以决定通过修改Ningx配置达到目的。
解决方案2-修改Nignx 配置
因为我们使用了Nginx作为反向代理，而Nginx修改配置后可以热加载，所以对线上项目更小，并且将来如果需要添加更多的跨域配置，都不用修改源代码，重新部署。
跨域原理
先来谈谈跨域原理，A网站如果要能够跨域访问B网站，那么B网站的response header中，必须包含以下值：
Access-Control-Allow-Origin: *
后边的*表示允许所有网站对B网站进行跨域访问，如果你只允许某几个网站对B网站进行跨域访问，那么把*改成对应的域名即可，中间用空格分开，如
Access-Control-Allow-Origin: 'https://www.baidu.com' 'https://www.taobai.com'
对于跨域访问的某些请求，在发送正式请求之前，浏览器会先向服务器发送一个OPTIONS类型的预检请求，对服务器进行询问，是否支持我接下来要发送的请求。如果服务器回复支持，那么浏览器就继续发送正式请求，如果服务器回复不支持，那么浏览器就不会发送正式请求了。
对于什么时候浏览器会发送OPTIONS，请参考什么时候发送options请求
在我们这个case中，因为B网站是采用oauth2.0进行校验的，A网站在发送请求时，需要在header中加上Authorization: bear token，这满足浏览器发送option请求的条件。所以服务器需要首先对options进行回复，告诉浏览器其是否支持它接下来的请求。
解决方案
让Nginx服务器来处理options请求，将正式请求转发到B网站。
Nginx配置如下：
server {
listen 443 ssl;
server_name website-b.com;
# 对B网站添加A网站的跨域访问支持
add_header 'Access-Control-Allow-Origin' https://www.website-a.com;
add_header 'Access-Control-Allow-Credentials' true;
add_header 'Access-Control-Allow-Headers' *;
add_header 'Access-Control-Allow-Methods' *;
add_header 'Access-Control-Expose-Headers' *;
location / {
# 所有的OPTIONS请求，返回204,
if ($request_method = 'OPTIONS') {
add_header 'Access-Control-Allow-Origin' *;
add_header 'Access-Control-Allow-Methods' *;
add_header 'Access-Control-Allow-Headers' *;
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://website-b-backend/;
}
}
upstream website-b-backend {
server 10.96.0.3:80 max_fails=1 fail_timeout=3s;
}
转自曾彪彪的个人博客，转载请注明出处。
