使用Nginx统一前后端域名#

​ 前后端无疑是现流行的开发框架模式，出于网络安全，流行浏览器都添加了跨域访问限制，在未预处理的情况下，当访问的Web站点内出现和其他域名或其他端口的HTTP通信便会拦截并警告跨域。

​ 本博客之前写过一篇关于Java语言的SpringBoot框架以及SpringSecurity的跨域处理。但是这些步骤过于复杂，而且生产环境和开发环境每次需要重新配置，非常不方便。那么有没有一种船新的方式从根源上解决这一问题呢?答案是有！

​ Nginx是一个轻量Web服务器，它允许你在一台服务器上允许多个域名的多个Web服务，当然，这也包括一项重要的功能——转发！

​ 跨域是因访问不同域名或不同端口的Http通信条件下触发的，从根源上解决这一问题，我直接让它们都访问同一域名同一端口不就好了！可是正常人都能知道两个服务怎么可能同时占用一个端口呢？这肯定不现实！当然我们肯定不是这么解决的，请看Nginx介入的方案：

​ 首先，环境如下:

假设我们环境为abc为站点域名 该域名解析至我们的服务器IP 假设为189.189.189.1 
前端跑在SSL 443服务 后端跑在服务器8001端口
前端 Nginx abc.com:443
后端 Java 189.189.189.1:8001

​ 我们的解决思路为：

1. 用户访问443端口，打开登陆页面，向abc.com/api/auth/login发送登录的Post请求
2. Nginx拦截了/api/路径下的所有请求，重定向到localhost:8001，而不是交给443的前端服务处理(那肯定是报403的)
3. 跑在8001端口的Java程序接收到了Nginx转发过来的Post请求，处理后将结果返回，由Nginx交还给客户

​ 好了，接下来上配置文件，首先你要把前端跑在Nginx上，不做演示，打开配置文件，根据需求添加如下字段:

第一种#

代理至地址，proxy_pass 后面没有 “ / ”

location /api {
	proxy_pass http://localhost:8001;
}

1. 访问：http://abc.com/api/xxx
2. 转至：http://abc.com:9898/xxx

第二种#

代理至地址，proxy_pass 后面有 “ / ”

location /api {
	proxy_pass http://localhost:8001/;
}

1. 访问：http://abc.com/api/xxx
2. 转至：http://abc.com:9898/api/xxx

第三种#

代理本地静态页面

location /page {
    alias   /usr/share/nginx/html/page/;
    index  index.html index.html;
}

一般来说第一种和第二种就可以解决这个问题了。