前段时候写项目的时候,遇到这样的问题,本地npm run dev正常,但是npm run build 后就接口报错405;然后就发现了是proxyTable的原因。以下来具体探讨一下:
前端的小伙伴都是知道的,前端存在同源策略,有跨域问题的存在,解决问题一般可以有白名单、反向代理,配置nginx等。
其中一项的就是用 proxyTable
正常基本配置为下:
proxyTable: {
'/api': {
target: http://wechat-122194.natapp1.cc', //设置你调用的接口域名和端口号 别忘了加http
changeOrigin: true,
pathRewrite: {
'^/api': '/'// 这里理解成用‘/api’代替target里面的地址,后面组件中我们掉接口时直接用api代替 比如我要调用'http://40.00.100.100:3002/user/add',直接写‘/api/user/add’即可
}
},
然后代码中使用的时候,例如有多个相同ip但是不同的接口,就可以这样使用
/api/upload
/api/rebot/get
因此我也是一直这样用的。
但是这个项目就是会出现上面所说的build后报错405问题,当我改成把每一个都分开单独写之后,再次npm run build 就正常了
'/upload': {
target: 'http://wechat-122194.natapp1.cc/upload',
changeOrigin: true,
pathRewrite: {
'^/upload': ' '
}
},
'/rebot/get': {
target: 'http://wechat-122194.natapp1.cc/rebot/get',
changeOrigin: true,
pathRewrite: {
'^/rebot/get': ' '
}
以上 虽然问题解决了,但是很不解这个问题的原因,欢迎有知道的大神解惑。