最近将公司vue 项目打包部署服务器时，产生了一点小插曲，开发环境中配置的跨域在将项目打包为静态文件时是没有用的 ，就想到了用 nginx 通过反向代理的方式解决这个问题，通过搜索引擎查阅相关资料，结合其精华就产生了这篇文章，有不好的地方还望理解。
前提条件
liunx 下 nginx 安装配置（将不做多的阐述，请自行百度）
配置nginx
-
通过 Xshell 连接 liunx 服务器 ，打开 nginx.conf 配置文件，或通过 WinSCP 直接打开并编辑nginx.conf文件 ，这里我选择后者 。（具体配置文件的路径根据你安装时决定）
-
在配置文件中新增一个server
# 新增的服务 # 新增的服务 server { listen 8086; # 监听的端口 server_name 47.106.197.89; # 可以随便起，尽量有意义 location / { root /home/; # vue 打包后静态文件存放的地址 index index.html; # 默认主页地址 } location /operateSysApi { proxy_pass http://47.106.197.89:9093/; # 代理接口地址 } location /csmsApi { proxy_pass http://47.106.197.89:9096/; # 代理接口地址 } error_page 500 502 503 504 /50x.html; location = /50x.html { root html; } }复制代码 - 解释说明
root /home/;的含义，这里配置的路径/home/是我当前将vue 文件打包后存放在 liunx下的路径 ，具体的路径模板为/home/mySystemManage, 当我们启动 nginx 后 就可以通过http://ip地址:8086/mySystemManage访问到vue 打包的静态文件。mySystemManage文件格式为如下图图示 - 1：
2.location /operateSysApi 指拦截以 operateSysApi 开头的请求，http请求格式为 http://ip地址:8086/operateSysApi/***。
proxy_pass http://47.106.197.89:9093/;当拦截到需要处理的请求时，将拦截请求代理到的 接口地址。