现在，大家大部分项目都是前后端分离吧，那么对于这种项目，分开部署如何通信呢？假如现在我们访问地址是：
前端地址是：http://localhost:8081 (vue+webpack+elementUI)
后端地址是：http://localhost:8080 (spring boot 项目)
一访问就跨域,今天就为大家介绍两种解决办法：

1. Nginx代理
2. 后台设置跨域

对于在这之前重来没有接触过Nginx的我，秒选第二种，但不得已，项目是中间接手，除了源码 ，其他什么都么有 ，你能想象这种痛苦吗？这些都是废话就跟大家抱怨一下，我们回到正题，解决跨域问题。

一：Nginx代理

假如我的请求格式如下：

细心的朋友就会疑问？你这url怎么是相对路径，这样写不好吧，当然你也可以写个全局变量，设置本地、测试、生产 不同的请求地址，然后上线的时候自行配置就可以了，就本地而例：baseUrl = http://localhost:8080/ 然后url:baseUrl+‘Auth/Login’ 这里我们就按照上图为例 这里不再啰嗦了。

安装Nginx

1.访问官网: http://nginx.org/en/download.html

2.直接解压下载文件

【喜欢输入命令的跳过这一步】解压完毕后我们不要着急运行nginx.exe文件，我们先在这个目录建立几个bat处理文件。方便我们以后快捷执行命令。直接新建一个txt文档，每个文档输入以下对应的简单的命令，然后把后缀改成bat文件即可。

1. 退出-批处理文件
   文件名：quit.bat
   文件内容： nginx -s quit

2. 重新加载配置-批处理文件
   文件名：reload.bat
   文件内容： nginx -s reload

3. 启动-批处理文件
   文件名：start.bat
   文件内容： start nginx

4. 停止-批处理文件
   文件名：stop.bat
   文件内容： nginx -s stop

如下图：

3.启动Nginx

启动方式有三种，如下：

1. 双击nginx.exe文件，命令行窗口一闪而过，不要紧张，这就代表启动了
2. 使用cmd命令行，进入到对应的nginx目录，输入命令 start nginx
3. 双击start.bat文件，命令行窗口也是会一闪而过……

打开你的浏览器，输入地址： http://localhost 如果出现以下画面，就代表成功启动啦

当然如果没有出现该画面，就要检查一下自己电脑的80端口是否被其他应用占用，如果要关闭nginx的小伙伴们可以输入命令：nginx -s quit 或者 nginx -s stop 进行关闭，当然写了bat处理文件的童鞋们，也只可以直接双击对应的bat文件进行关闭。

\

4.设置代理

成功启动了Nginx，那么我们接下来就开始配置Nginx的反向代理了。打开conf文件夹，打开nginx.conf 的配置文件。

然后你会看到一大堆配置内容以及注释掉的配置项，对于原先的配置文件我们先不要理会 找到 http{} 里面的第一个server 然后设置代理：（万般联系原项目方，原项目方给的解决办法）

图中的意思是这样的，监控8081端口，转发到 / 里面 结果 localtion /没有转发到任何地址
很尴尬，这种方式不行，万般思考后，得到如下配置：

server{
	listen: 80                                                     #监听的端口
	server_name: localhost                                         #ip地址
	
	location / {                                                   #监听80端口,所有请求都转发到8081的前端地址
			root: 	html;
			index   index.html  index.htm;
			proxy_pass  http://localhost:8081;                     #前端地址
	}
	
	localtion /Auth {                                              #配置后台数据的接口 所有/Auth的请求都转发到后台地址
				proxy_pass  http://localhost:8080;                 #后端地址
	}

}

然后保存，关闭nginx.conf文件

注意：
这里并不是只有/Auth（我们请求太多怎么玩） 你可以添加统一的前缀,如: /api （设置参数 baseUrl=’/api’ 然后请求的地方都加上 baseUrl） 这里以 ‘/Auth’ 为例；
如果还是不行的话，就要看看logs下边的日志文件 另寻答案了
这样 我们输入前端地址 http://localhost:8081 然后触发访问后端接口的事件，这样我们就解决前后分离的跨域问题了。

二：后台设置跨域、

至于这种解决方案，就不详细解答了 在这为大家奉上一篇解决办法
https://blog.csdn.net/u011526234/article/details/79711721

三：加油吧，朋友

感想：在这没有搞过这个事情的时候 感觉有点困难，当你仔细去找办法解决的时候，其实也就那样，很简单的，所以，只要多努力点 没有什么办不了，正所谓：天下无难事 只怕有心人