vue打包后，接口请求404的完美解决方案

在开发环境中，和后台对接为了解决跨域问题，使用了代理，也就是vue的proxyTable，可是打包放到生产环境中去时，接口请求不到，404，缘由是开发环境的代理并不能用到生产环境，可是直接在请求接口是使用服务器地址，能够成功，可是会形成cookie丢失而失去权限验证

我脑海里出现有两种办法，一是使用代理，如何解决接口路径请求404的问题，二是直接写请求路径，如何解决cookie丢失的问题

以前由于cookie丢失，后台忙活了很长时间，好不容易才解决的，加之开发环境下并不会丢失，因此个人想法是继续使用代理

在网上找了不少办法，有很多人遇到这个问题，可是基本都没有详细的解决方案，好不容易才找到说能够试试用nginx反向代理的方式，OK，开干

首先，前端仍是先不改动，接口路径依然是'/api/...'：

登陆服务器，找到nginx的安装目录下：cd /etc/nginx

打开配置文件 vi nginx.conf

按  i  修改，新增

location /api { proxy_set_header Host $host; proxy_set_header x-forwarded-for $remote_addr; proxy_set_header X-Real-IP $remote_addr; proxy_pass http://127.0.0.1:8080; // 接口地址，若是在同一个服务器上，能够直接这样写
        }

保存退出，先esc，而后保存   :wq!

nginx支持热启动，因此直接重启命令    service nginx reload

OK了，nginx反向代理生效了，如今能够继续用代理，接口请求成功，也不会丢失cookie，喜大普奔！

 

最后整理一下Linux模式下退出编辑模式的操做：

编辑结束，按ESC 键 跳到命令模式，而后输入退出命令：

:w 保存文件但不退出vi 编辑

:w! 强制保存，不退出vi 编辑

:w file 将修改另存到file中，不退出vi 编辑

:wq 保存文件并退出vi 编辑

:wq! 强制保存文件并退出vi 编辑

q: 不保存文件并退出vi 编辑

:q! 不保存文件并强制退出vi 编辑

:e! 放弃全部修改，从上次保存文件开始在编辑

 

但愿本文对你有所帮助！