vue设置代理字段详解

2019-12-21 分类：前端之旅阅读(2989) 评论(0)

这里的vue代理是 vue静态服务器做代理。使用的是 http-proxy-middleware 这个模块（这个模块相当于是node.js的一个插件）。

module.exports = {
  devServer: {
    proxy: {
      '/admin': {
        target: 'http://ar.he29.com/', //对应自己的接口
        changeOrigin: true,
        ws: true,
        secure: true, //如果是https接口，需要配置这个参数
        pathRewrite: {
          // '^/api': ''
        }
      }
    }
  }
}

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

module.exports = {

devServer: {

proxy: {

'/admin': {

target: 'http://ar.he29.com/', //对应自己的接口

changeOrigin: true,

ws: true,

secure: true, //如果是https接口，需要配置这个参数

pathRewrite: {

// '^/api': ''

}

我的 api=’/admin’
我的请求地址 ${api}/xxxx/xxx ，请求地址就为 ‘/admin/xxxx/xxx’
当node服务器遇到以 ‘/admin’ 开头的请求，就会把 target 字段加上，那么我的请求地址就为 http://ar.he29.com/admin/xxxx/xxx
下面的 pathRewrite 表示的意思是把/api 替换为空，那么我的请求地址就为 http://ar.he29.com/xxxx/xxx（用在如果你的实际请求地址没有 api 的情况）