express实现反向代理解决跨域问题

使用vue element框架搭建了一个后台管理系统，这避免不了要和后台进行交互，但是在和后台交互的时候出现了跨域问题。之前遇到跨域问题，就是后台设置一下cors,这是最常用的做法，但是这种做法也会存在一下安全性问题。
所以在考虑前端可不可以解决跨域，经过一些尝试，发现前端是可以解决的。说一下我的项目。
我是使用vue-cli脚手架搭建的项目，在这个项目里使用了代理服务器，主要以下几个方面需要注意

1 .在config里面的index.js文件设置

2.安装express 和http-proxy-middleware。
使用如下命令npm install --save-dev express http-proxy-middleware

express是基于 Node.js 平台，快速、开放、极简的 web 开发框架。
http-proxy-middleware 是专门用于 http 代理的一个 node 中间件，适用于connect,express, browser-sync 等等，由热门的http-proxy 驱动。

3.使用npm run build 进行打包，打包之后会在dist文件夹下面生成一个app.js文件，在app.js文件里面添加如下代码。

var proxyMiddleWare= require('http-proxy-middleware');
var app = express();
var proxyPath = "http://47.104.208.182:8087";//目标后端服务地址
var proxyOption ={
    target:proxyPath,
    changeOrigoin:true,
    ws: true,
    pathRewrite: { '^/api': '/' }
};
app.use(express.static(__dirname + "public"));
app.use("/api",proxyMiddleWare(proxyOption));
app.listen(4000);//4000是我要启动的端口

4.把dist里面的文件全部放在服务器上，此时你的服务器是用node express搭建的，(express搭建的架构完全不需要后端去配置apache或者nginx，前端一个人就可以完成）。但是到这一步你发现线上的项目并没有如你预期的那样，依旧提示接口找不到，报404的错误。原因是你你使用了中间代理服务器但是并没有启动代理服务器。下面我给出启动代理服务器的方法：

• 使用xshell进入到项目所在目录，然后运行npm start发现并没有正常运行，而是提示
  然后此时需要解除端口占用，你可以ps -aux | grep node，查看此时正在使用的进程。输入之后发现
  
  找到app.js所在的进程后，kill -s 9 19066 注意19066是app.js所在的进程号，杀死进程就可以了。此时刷新页面，发现问题已经解决。

---

注意：关于express的知识参考http://www.expressjs.com.cn/
关于启动express问题参考https://www.cnblogs.com/miaodi/p/6899084.html