行业知识
2024年前端最新vue配置proxy跨域代理
最后
文章到这里就结束了，如果觉得对你有帮助可以点个赞哦
开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】
const { defineConfig } = require(‘@vue/cli-service’)
module.exports = defineConfig({
devServer:{
proxy:{
// 代理1
// 当你请求是以/api开头的时候，则我帮你代理访问到http://127.0.0.1:3000
‘/api’: {
target: ‘http://127.0.0.1:3000’,
// secure: false,// 如果是https接口，需要配置这个参数
// ws: true, //是否代理websockets， 默认值为true
/\*
changeOrigin设置为true时，服务器收到的请求头中的host为：localhost:3000
changeOrigin设置为false时，服务器收到的请求头中的host为：localhost:8080
changeOrigin默认值为true
*/
changeOrigin: true, // 设置请求头中的host地址，默认值为true //地址中的 /api 仅仅是一个请求转发标志，真正的接口中没有/api，所以在转发时重写请求路径，把/api删掉。 pathRewrite: {'^/api' : ''} }, // 代理2 '/douyu':{ target: 'http://open.douyucdn.cn', pathRewrite: {'^/douyu' : ''} }} }
#### 设置多个代理
const { defineConfig } = require(‘@vue/cli-service’)
module.exports = defineConfig({
transpileDependencies: true,
lintOnSave: false, //是否使用link检查代码
devServer: {
//方式二:设置多个代理
proxy:{
//这个路径为http://192.168.1.182:3000/douyu/wgapi/vod/front/vodrank/getTagVideos
‘/douyu’:{
//target是代理的目标路径
target:“http://192.168.1.182:3000”,
//pathRewrite重写请求的路径,实际请求的路径没有代理标识douyu,需要把斗鱼重置为空字符串
pathRewrite:{‘^/douyu’:‘’}
},
//这个路径为http://192.168.1.182:3000/huya/wgapi/vod/front/vodrank/getTagVideos
‘/huya’:{
//target是代理的目标路径
target:“http://192.168.1.182:3000”,
//pathRewrite重写请求的路径,实际请求的路径没有代理标识douyu,需要把斗鱼重置为空字符串
pathRewrite:{‘^/huya’:‘’}
}
}
}
});
#### 发送ajax请求的方法使用
getData() {//douyu代理 axios.post('http://localhost:8080/douyu/wgapi/vod/front/vodrank/getTagVideos', { tagId: 0 }).then(res => { console.log('res.data:', res.data); });//huya代理 axios.post('http://localhost:8080/huya/wgapi/vod/front/vodrank/getTagVideos', { tagId: 0 }).then(res => { console.log('res.data:', res.data); });}, ### 最后小编综合了阿里的面试题做了一份前端面试题PDF文档，里面有面试题的详细解析**开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】** 虽只说了一个公司的面试，但我们可以知道大厂关注的东西并举一反三，通过一个知识点延伸到另一个知识点，这是我们要掌握的学习方法，小伙伴们在这篇有学到的请评论点赞转发告诉小编哦，谢谢大家的支持！,t_70)虽只说了一个公司的面试，但我们可以知道大厂关注的东西并举一反三，通过一个知识点延伸到另一个知识点，这是我们要掌握的学习方法，小伙伴们在这篇有学到的请评论点赞转发告诉小编哦，谢谢大家的支持！
上一篇：方舟服务器怎么授权邮箱?
下一篇：安卓手机双微信下载与安装教程
