Vue2配置前端代理

在8080向5000请求数据

cli+vue2

一、cli内配置前端代理

1、使用

发送请求时写8080

在配置文件中配置 vue.config.js

2、缺点

  1. 无法配置多个代理
  2. 无法控制某个请求知否要代理

二、方式二

复制代码
module.exports = {
    devServer: {
        proxy: {
            '/api1':{   //匹配所有以'/api1'开头的请求路径
            target:'http:/localhost:5000',//代理目标的基础路径
            changeOrigin:true,
            ws:true  //用于支持websocket 不用可以不配置
            pathRewrite:{'/api1':''}  //用于重写路径,将左边的部分用右边替换
            },
            '/api2':{//匹配所有以'/api2'开头的请求路径
            target:'http://localhost:5001',//代理目标的基础路径
            changeOrigin:true,
            pathRewrite:{'/api2':''}
            }
        }
    }
}



changeOrigin设置为true时,服务器收到的请求头中的host为:localhost:5000
changeOrigin设置为false时,服务器收到的请求头中的host为:localhost:8080
changeOrigin默认值为true
相关推荐
namekong812 小时前
清理谷歌浏览器垃圾文件 Chrome “User Data”
前端·chrome
开发者小天13 小时前
调整为 dart-sass 支持的语法,将深度选择器/deep/调整为::v-deep
开发语言·前端·javascript·vue.js·uni-app·sass·1024程序员节
李少兄15 小时前
HTML 表单控件
前端·microsoft·html
学习笔记10116 小时前
第十五章认识Ajax(六)
前端·javascript·ajax
消失的旧时光-194316 小时前
Flutter 异步编程:Future 与 Stream 深度解析
android·前端·flutter
曹牧17 小时前
C# 中的 DateTime.Now.ToString() 方法支持多种预定义的格式字符
前端·c#
勿在浮沙筑高台17 小时前
海龟交易系统R
前端·人工智能·r语言
歪歪10017 小时前
C#如何在数据可视化工具中进行数据筛选?
开发语言·前端·信息可视化·前端框架·c#·visual studio
Captaincc18 小时前
AI 能帮你写代码,但把代码变成软件,还是得靠人
前端·后端·程序员