vue 配置跨域访问

Posted jackking

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了vue 配置跨域访问相关的知识,希望对你有一定的参考价值。

主要在config->index.js中配置 
proxyTable: { 
‘/gameapi’: { 
changeOrigin: true, 
// target: ‘http://rap.id.cn/mockjs/20‘, mock地址 
target: ‘http://192.168.1.124‘,服务器地址 
pathRewrite: { 
‘^/gameapi’: ‘/gameapi’ 
}, 
secure:false 


因此,发送请求时候url写为(’/gameapi/gift-applylist’)就能拿到接口数据。 
但是注意配置后需要重新npm run dev才会生效。 
当然如果有两个不同路径也可以配置两个 
proxyTable: { 
‘/gameapi’: { 
changeOrigin: true, 
// target: ‘http://rap.id.cn/mockjs/20‘, 
target: ‘http://192.168.1.124‘, 
pathRewrite: { 
‘^/gameapi’: ‘/gameapi’ 
}, 
secure:false 
}, 
‘/cps’: { 
changeOrigin: true, 
// target: ‘http://rap.idu.cn/mockjs/20‘, 
target: ‘http://192.168.1.124‘, 
pathRewrite: { 
‘^/cps’: ‘/cps’ 
}, 
secure:false 

},

以上是关于vue 配置跨域访问的主要内容,如果未能解决你的问题,请参考以下文章

使用vue-cli+axios配置代理进行跨域访问数据

Vue项目中跨域问题的解决

vue3.0+nginx跨域问题

vue.config.js跨域配置,以及代理配置

vue项目开发,用webpack配置解决跨域问题

开发环境Vue访问后端代码(前后端分离开发,端口不同下跨域访问)