vue.js 配置了前端代理却未能生效
记录一下最近踩得小坑:
配置完代理后请一定重新执行(重要,非常重要!)
npm run dev
若重新执行命令后,代理仍为生效,请按下方步骤进行检查:
检查index.js文件中的代理是否配置正确,示例如下:
proxyTable: { '/api': { //代理标识 target: 'http://xxx.xxx.xxx',//指向的实际地址 changeOrigin: true, // 允许跨域 pathRewrite: { // 标识替换 // 原请求地址为 /api/getData 将'/api'替换''时, // 代理后的请求地址为: http://xxx.xxx.xxx/getData // 若替换为'/other',则代理后的请求地址为 http://xxx.xxx.xxx/other/getData '^/api': '' } } },
检查请求路径是否正确,以上方所配置的代理为例
// 请确认原请求中是否包含代理标识符 // 请确认接口 http://xxx.xxx.xxx/getData直接访问是否正常 this.$axios.get('/api/getData').then((r)=>{ console.log(r) })
补充知识:vue使用proxyTable设置接口代理
1、修改config/index.js里proxyTable
proxyTable: { '/api': { target: 'http://192.168.42.182:8080', changeOrigin: true, pathRewrite: { '^/api': '/' } }, }
2、修改config/dev.env.js
module.exports = merge(prodEnv, { NODE_ENV: '"development"', API: '"/api"' // 加入这一句 })
3、设置axios的baseUrl
export default { get (url, params) { return axios({ method: 'get', baseURL: process.env.API, // 修改这里 url, params, timeout: 100000 }).then((response) => { return checkStatus(response) }).then((res) => { return checkCode(res) }) } }
4、重启服务器 npm run dev就好啦~
以上这篇Vue使用Proxy代理后仍无法生效的解决就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持。
标签:
Vue,Proxy代理,无法生效
免责声明:本站文章均来自网站采集或用户投稿,网站不提供任何软件下载或自行开发的软件!
如有用户或公司发现本站内容信息存在侵权行为,请邮件告知! 858582#qq.com
暂无“Vue使用Proxy代理后仍无法生效的解决”评论...
更新动态
20240626
20240626
- 瑞鸣音乐《中国音乐地图之听见河南豫剧经典唱段》2020[WAV分轨]
- 【伊比萨沙发】VA-2024-IbizaSpring2024(LoungeCocktailsfromtheHeart)[FLAC]
- 群星《世界顶级汽车音响试音王》4K金碟16CD[WAV+CUE]
- 群星-音效环绕天碟《极致环绕人声天碟天品》7CD[WAV]
- 泰拉克SACD古典试音碟7SACD-ISO
- 群星《红歌宝典》20CD[WAV/分轨]
- 《101系列:好歌101首 细听年代精选》[WAV+CUE][3.6GB]
- 《101系列 6CD 国语经典101首歌曲 张学友 王菲代表作》[APE+CUE][2.8GB]
- 《101系列:国语经典101 VOL2 6CD 精选最经典101首》[WAV+CUE][2.3GB]
- 群星《十年网络红歌》15CD[WAV分轨]
- 宝丽金-环球10周年至50周年经典金曲15CD[低速原抓WAV+CUE]
- FIM唱片《十大男伶》[低速原抓WAV+CUE]
- 《101系列:情歌101 6CD》[WAV+CUE][3.1GB]
- 庄心妍《降调版合集》[320K/MP3][52.96MB]
- 庄心妍《降调版合集》[FLAC/分轨][118.78MB]