zoukankan      html  css  js  c++  java
  • vue proxyTable代理 解决开发环境的跨域问题

    如果我们项目请求的地址为 htttp://xxxx.com/a/b/c 

    可以设置代理为:

    dev:{ 

        assetsSubDirectory: 'static',// 静态资源文件夹

        assetsPublicPath: '/',// 发布路径

      proxyTable: { // 代理配置表,在这里可以配置特定的请求代理到对应的API接口 // 例如将'localhost:8080/api/xxx'代理到'www.example.com/api/xxx' // 使用方法:https://vuejs-templates.github.io/webpack/proxy.html
           '/a': {
                  target: htttp://xxxx.com/a',
                 // secure: false,  // 如果是https接口,需要配置这个参数

      changeOrigin: true,// 如果接口跨域,需要进行这个参数配置
                 pathRewrite: {
                   '^/a': ''
                 }
    }
    }

    }

    例如:接口地址原本是 /save/index,但是为了匹配代理地址,在前面加一个 /api,  因此接口地址需要写成这样的即可生效 /api/save/index。

    注意: '/api' 为匹配项,target 为被请求的地址,因为在 请求的 url 中加了前缀 '/api',而原本的接口是没有这个前缀的,所以需要通过 pathRewrite 来重写地址,将前缀 '/api' 转为 '/'。如果本身的接口地址就有 '/api' 这种通用前缀,就可以把 pathRewrite 删掉。

    项目中常见的:

    项目中请求的地址应该为 axios.get('/a/b/c'),代理解析时会在a前面加上" htttp://xxxx.com"变成了" htttp://xxxx.com/a/b/c",
    当项目打包上线时,代码里的请求地址不需要改动,因为当线上代码运行时,遇到
    axios.get('/a/b/c') ,a前面有个‘/’代表根目录的意思。
    所以‘/a/b/c’会被解析为 postname+port+'a/b/c',所以请求地址为 ‘
    htttp://xxxx.com/a/b/c’。

  • 相关阅读:
    HTML常用标签1
    mysql 多对多拆分成 一对多(学生,选修课,成绩)
    JDBC工具包使用
    类反射,用于JDBC
    JDBC基础语句使用
    关于线程等待、线程唤醒方法的引入
    synchronized站点抢票同步例题
    python-装饰器
    jwt, token, session和cookies
    miniapp之登录、授权和支付
  • 原文地址:https://www.cnblogs.com/huoerheaven/p/9701125.html
Copyright © 2011-2022 走看看