在vue中配置不同的代理同时访问不同的后台操作


Posted in Javascript onSeptember 11, 2020

如果和不同的后台调接口,如果后台接口没有合到一起,前端可以配不同的代理来共同访问他们的接口

在config文件夹下的index.js中设置如下:

proxyTable: {
  '/api/login': { // 第一个代理:此处的路径是所有接口前面相同的部分,用来匹配带有这部分路径的
    target: "http://192.168.100.209:8910",
    changeOrigin: true,
    secure: false
  },
  '/api/supplier': { // 设置第二个代理
    target: "http://192.168.101.26:8910",
    changeOrigin: true,
    secure: false
  },
}

补充知识:vue项目开发环境下实现与多个后台进行联调

在配置开发环境设置反向代理的地方设置反向代理

proxyTable: {
      '/jk': {
        target: 'http://10.200.101.121:8090/',
        //target: 'http://118.24.184.180:8080/',
        changeOrigin: true,
        pathRewrite: {
          '^/api': '/api', //重写,
        }
      },
      '/wxapi': {
        target: 'http://10.200.102.141:8089',
        changeOrigin: true,
        pathRewrite: {
          '^/wxapi': '/wxapi', //重写,
        }
      },
      '/wxttxx': {
        target: 'http://10.200.102.141:8089',
        changeOrigin: true,
        pathRewrite: {
          '^/wxttxx': '/wxttxx', //重写,
        }
      }
    },

这样就可以根据不同的后台进行联调了

以上这篇在vue中配置不同的代理同时访问不同的后台操作就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
js 单引号 传递方法
Jun 22 Javascript
jQuery select操作控制方法小结
May 26 Javascript
裁剪字符串trim()自定义改进版
Apr 10 Javascript
jquery特效 幻灯片效果示例代码
Jul 16 Javascript
一个仿糯米弹框效果demo
Jul 22 Javascript
基于jQuery实现弹幕APP
Feb 10 Javascript
jQuery布局组件EasyUI Layout使用方法详解
Feb 28 Javascript
手机注册发送验证码倒计时的简单实例
Nov 15 Javascript
元素全屏的设置与监听实例
Nov 28 Javascript
JS实现十字坐标跟随鼠标效果
Dec 25 Javascript
Bootstrap table中toolbar新增条件查询及refresh参数使用方法
May 18 Javascript
在vue中使用vuex,修改state的值示例
Nov 08 Javascript
vscode中的vue项目报错Property ‘xxx‘ does not exist on type ‘CombinedVueInstance<{ readyOnly...Vetur(2339)
Sep 11 #Javascript
Vue proxyTable配置多个接口地址,解决跨域的问题
Sep 11 #Javascript
关于ES6尾调用优化的使用
Sep 11 #Javascript
在js文件中引入(调用)另一个js文件的三种方法
Sep 11 #Javascript
Vue项目开发常见问题和解决方案总结
Sep 11 #Javascript
JavaScript实现简单日历效果
Sep 11 #Javascript
vue $mount 和 el的区别说明
Sep 11 #Javascript
You might like
js下函数般调用正则的方法附代码
2008/06/22 PHP
用php实现选择排序的解决方法
2013/05/04 PHP
php中JSON的使用方法
2015/04/30 PHP
PHP正则表达式匹配替换与分割功能实例浅析
2017/02/04 PHP
php求数组全排列,元素所有组合的方法总结
2017/03/14 PHP
PHP+MySQL实现模糊查询员工信息功能示例
2018/06/01 PHP
Laravel框架搜索分页功能示例
2019/02/01 PHP
CSS+JS构建的图片查看器
2006/07/22 Javascript
JavaScript定义类的几种方式总结
2014/01/06 Javascript
js使用html()或text()方法获取设置p标签的显示的值
2014/08/01 Javascript
jQuery入门介绍之基础知识
2015/01/13 Javascript
javascript实现详细时间提醒信息效果的方法
2015/03/11 Javascript
jQuery+HTML5实现手机摇一摇换衣特效
2015/06/05 Javascript
使用基于Node.js的构建工具Grunt来发布ASP.NET MVC项目
2016/02/15 Javascript
原生JS实现几个常用DOM操作API实例
2017/01/19 Javascript
微信小程序中post方法与get方法的封装
2017/09/26 Javascript
vue项目中的webpack-dev-sever配置方法
2017/12/14 Javascript
基于javascript 显式转换与隐式转换(详解)
2017/12/15 Javascript
在vue 中使用 less的教程详解
2018/09/26 Javascript
微信小程序定义和调用全局变量globalData的实现
2019/11/01 Javascript
JS Web Flex弹性盒子模型代码实例
2020/03/10 Javascript
微信小程序实现手指拖动选项排序
2020/04/22 Javascript
[14:57]DOTA2 HEROS教学视频教你分分钟做大人-幽鬼
2014/06/13 DOTA
[01:03:42]VP vs VGJ.S 2018国际邀请赛小组赛BO2 第一场 8.19
2018/08/21 DOTA
在Python的Django框架中包装视图函数
2015/07/20 Python
Python 从一个文件中调用另一个文件的类方法
2019/01/10 Python
Python中低维数组填充高维数组的实现
2019/12/02 Python
PyTorch中的Variable变量详解
2020/01/07 Python
关于python 跨域处理方式详解
2020/03/28 Python
python3 sleep 延时秒 毫秒实例
2020/05/04 Python
女士鞋子、包包和服装在线,第一款10美元:ShoeDazzle
2019/07/26 全球购物
远东集团网络工程师面试题
2014/10/20 面试题
学校法制宣传月活动总结
2014/07/03 职场文书
法律专业大学生职业生涯规划书:向目标一步步迈进
2014/09/22 职场文书
教研活动主持词
2015/07/03 职场文书
vue Element-ui表格实现树形结构表格
2021/06/07 Vue.js