记录第一次springboot+vue前后端分离项目在远程服务器上部署的血泪史(nginx解决跨域问题)

如题：

背景：做了一个简单的大文件上传下载的项目，然后应上司要求部署到服务器上运行。这几天到处查资料，解决一个又一个问题，总算看到成果了，在此记录一下。

后端 springboot+mybatis+mysql5.7 IDEA
前端 vue-cli3
windows服务器下
前期工具准备：
1. jdk安装
2. nginx安装（反向代理服务器解决跨域）这里安装教程
3. mysql数据库安装

以上可自行百度，底部附上一些教程仅供参考。

1. vue项目打包

很简单，打开前端项目后（我用的idea）,底部terminal直接输入npm run build回车，打包开始…结束后会在项目根目录下出现一个dist文件夹就是我们需要的东西。
然后将dist文件夹复制到服务器上任意位置，之后nginx配置时会用到。

2. springboot项目打包

打开后端项目，点击右侧边栏maven，然后如下点击package打包。

之后如下jar包即我们需要的。
同理将jar包复制到服务器上任意目录。

3. MySQL相关

将后端项目的sql文件拖拽到mysql客户端上（我用的dbeaver）建立好数据库以及表。注意后端项目的数据库url一定要和此处对应，不然数据库访问不了后端也完蛋。

4. 配置nginx，启动项目

cd到后端jar包所在目录，运行命令：
java -jar XXXXXX.jar &（你自己jar包名字，后面加&符号 使得可以退出黑窗体干别的）
也可以写两个批处理双击运行和停止。
此时后端服务成功启动。

重点来了！配置nginx:
打开nginx文件夹中的config->nginx.config文件进行配置：

如上图，标有箭头的都是配置关键点，配置必不可少，其余部分看个人情况而定。

跨域问题解决完毕。

5. 浏览器访问

打开浏览器输入服务器ip地址访问前端项目即可。

记录我遇到的问题：

1. 后端项目打包失败
   原因是因为测试不通过，查找资料暂时没遇到真正解决的，都是绕过测试打包，解决办法：打开pom.xml添加插件，测试改为true:
   

2.nginx配置完后访问项目各种报错，当时头老大了，解决后觉得太傻了。。。
比如其中一个是报错: 502 Bad Gateway,寻思为啥一上传文件就报get post502错误，纠结老半天，什么请求头太大了修改配置之类的，也都改了，不记得是哪项起作用了。。。
另一个就是404了，也是没头绪，后来看一个人评论别人说找找url，自己检查了一阵结果还真是。。。

端口后面少加了一个 / 。

暂时就想到这些。

参考博客：
如何在服务器上部署并解决跨域问题