Vue中如何实现proxy代理


Posted in Javascript onApril 20, 2018

Vue 框架开发的时候,会遇到跨域的问题,可在config/index.js 里配置proxyTable内容,使用proxy 代理。

// config/index.js 文件
proxyTable: {
   '/api': {
    target: 'http://192.168.149.90:8080/', // 设置你调用的接口域名和端口号
    changeOrigin: true,   // 跨域
    pathRewrite: {
     '^/api': '/'     
    }
   }
  },

这里理解成用‘/api'代替target里面的地址,后面组件中我们掉接口时直接用api代替 比如我要调用'http://192.168.149.90:8080/xxx/duty?time=2017-07-07 14:57:22',直接写‘/api/xxx/duty?time=2017-07-07 14:57:22'即可

在dev.env.js 里配置开发环境请求地址

// config/dev.env.js 文件
module.exports = merge(prodEnv, {
 NODE_ENV: '"development"',
 ADMIN_SERVER: '"/api/"',
});

若请求插件用的 axios,配置如下

const adminServer = axios.create({
 baseURL: process.env.ADMIN_SERVER,
});

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
善用事件代理,警惕闭包的性能陷阱。
Jan 20 Javascript
Ext.get() 和 Ext.query()组合使用实现最灵活的取元素方式
Sep 26 Javascript
禁止ajax缓存获取程序最新数据的方法
Nov 19 Javascript
js中事件的处理与浏览器对象示例介绍
Nov 29 Javascript
JS使用replace()方法和正则表达式进行字符串的搜索与替换实例
Apr 10 Javascript
JS基于Ajax实现的网页Loading效果代码
Oct 27 Javascript
JS多物体实现缓冲运动效果示例
Dec 20 Javascript
Angular.js前台传list数组由后台spring MVC接收数组示例代码
Jul 31 Javascript
详解Vue双向数据绑定原理解析
Sep 11 Javascript
js嵌套的数组扁平化:将多维数组变成一维数组以及push()与concat()区别的讲解
Jan 19 Javascript
element 中 el-menu 组件的无限极循环思路代码详解
Apr 26 Javascript
在js文件中引入(调用)另一个js文件的三种方法
Sep 11 Javascript
React diff算法的实现示例
Apr 20 #Javascript
vue中子组件向父组件传递数据的实例代码(实现加减功能)
Apr 20 #Javascript
node实现登录图片验证码的示例代码
Apr 20 #Javascript
vue项目中api接口管理总结
Apr 20 #Javascript
通过jquery获取上传文件名称、类型和大小的实现代码
Apr 19 #jQuery
js Element Traversal规范中的元素遍历方法
Apr 19 #Javascript
关于vue中的ajax请求和axios包问题
Apr 19 #Javascript
You might like
有关JSON以及JSON在PHP中的应用
2010/04/09 PHP
php实现利用phpexcel导出数据
2013/08/24 PHP
一个实用的php验证码类
2017/07/06 PHP
启用OPCache提高PHP程序性能的方法
2019/03/21 PHP
javascript深入理解js闭包
2010/07/03 Javascript
JavaScript表单通过正则表达式验证电话号码
2014/03/14 Javascript
判断在css加载完毕后执行后续代码示例
2014/09/03 Javascript
jQuery创建DOM元素实例解析
2015/01/19 Javascript
javascript实现带节日和农历的日历特效
2015/02/01 Javascript
在for循环中length值是否需要缓存
2015/07/27 Javascript
JavaScript如何实现在文本框(密码框)输入提示语
2015/12/25 Javascript
Jquery attr()方法 属性赋值和属性获取详解
2016/04/15 Javascript
AngularJS出现$http异步后台无法获取请求参数问题的解决方法
2016/11/03 Javascript
js实现音频控制进度条功能
2017/04/01 Javascript
AngularJs 延时器、计时器实例代码
2017/09/16 Javascript
ionic选择多张图片上传的示例代码
2017/10/10 Javascript
微信小程序左滑删除功能开发案例详解
2018/11/12 Javascript
vue+eslint+vscode配置教程
2019/08/09 Javascript
D3.js 实现带伸缩时间轴拓扑图的示例代码
2020/01/20 Javascript
微信小程序如何实现点击图片放大功能
2020/01/21 Javascript
使用Node.js和Socket.IO扩展Django的实时处理功能
2015/04/20 Python
Python内建数据结构详解
2016/02/03 Python
Python简单删除列表中相同元素的方法示例
2017/06/12 Python
[原创]pip和pygal的安装实例教程
2017/12/07 Python
值得收藏,Python 开发中的高级技巧
2018/11/23 Python
CSS3的transition和animation的用法实例介绍
2014/08/20 HTML / CSS
详解css3使用transform出现字体模糊的解决办法
2020/10/16 HTML / CSS
美国非常受欢迎的Spa品牌:Bliss必列斯
2018/04/10 全球购物
介绍一下Python中webbrowser的用法
2013/05/07 面试题
房务中心文员岗位职责
2014/04/16 职场文书
2016年国陪研修感言
2015/11/18 职场文书
七年级英语教学反思
2016/02/15 职场文书
创业计划书之溜冰场
2019/10/25 职场文书
详解Python如何批量采集京东商品数据流程
2022/01/22 Python
Nginx性能优化之Gzip压缩设置详解(最大程度提高页面打开速度)
2022/02/12 Servers
SpringBoot Http远程调用的方法
2022/08/14 Java/Android