这篇文章主要讲解了VueCli4项目怎么配置反向代理proxy,内容清晰明了,对此有兴趣的小伙伴可以学习一下,相信大家阅读完之后会有帮助。
Vue Cli4创建项目之后,没有配置vue.config.js,如果直接发起axios请求,可能会引起跨域问题.
以豆瓣电影首页的最近热门 为例:
axios({
method: "get",
url: "https://movie.douban.com/j/search_subjects",
params: {
type: "movie",
tag: "热门",
page_limit: 50,
page_start: 0
}
}).then(res => {
console.log(res.data);
});
如果直接发起请求必然会引起跨域错误,只需要在项目根目录手动创建vue.config.js文件:
module.exports = {
devServer: {
proxy: {
"/j": {
target: "https://movie.douban.com",
changeOrigin: true
}
}
}
};
然后修改axios请求的url地址:
最后 重启该项目 重启该项目 重启该项目 即可
看完上述内容,是不是对VueCli4项目怎么配置反向代理proxy有进一步的了解,如果还想学习更多内容,欢迎关注天达云行业资讯频道。