vue - vue.config.js中devServer配置方式


Posted in Javascript onOctober 30, 2019

前言

这里写你调用接口的基础路径,来解决跨域,如果设置了代理,那你本地开发环境的axios的baseUrl要写为'',即空字符串

只有一个接口ip端口时

devServer: {
  open: false,
  // 跨域
  proxy: {
   '/nuojinadm/': {
    target: 'http://192.168.0.11/',
    changeOrigin: true
   }
  }
 }

2、设置axios中的baseUrl 与proxy端口一致

baseUrl: {
  dev: '/nuojinadm/',
  pro: '/nuojinadm/'
 }

当有多个ip端口的接口时

devServer: {
  open: false,
  port: 8801, // 自定义修改8080端口
  // 代理跨域
  proxy: {
   '/proxy1/adm/': {
    target: 'http://192.168.0.xx:xxxx/',
    changeOrigin: true
   },
   '/proxy2/adm/': {
    target: 'http://192.168.0.xx:xxxx/',
    changeOrigin: true
   },
   '/httpsProxy3/config/': {
    target: 'https://xx.xx.com',
    secure: false, // https协议才设置
    changeOrigin: true
   }
  }
 }

2、设置axios中的baseUrl 设置为空

baseUrl: {
  dev: '/',
  pro: '/'
 }

3、在每个request(axios)页面中

const proxyxxx= '/xxx/xxx'

export const getBannerList = params => {
 return axios.request({
  url: `${proxyxxx}/banner/v1/banner/${params.pageSize}/${params.pageNum}`,
  params,
  method: 'get'
 })
}

以上这篇vue - vue.config.js中devServer配置方式就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Json2Template.js 基于jquery的插件 绑定JavaScript对象到Html模板中
Oct 29 Javascript
JavaScript Math.ceil() 函数使用介绍
Dec 11 Javascript
jQuery元素的隐藏与显示实例
Jan 20 Javascript
js实现表单多按钮提交action的处理方法
Oct 24 Javascript
总结Node.js中的一些错误类型
Aug 15 Javascript
js 性能优化之算法和流程控制
Feb 15 Javascript
JavaScript错误处理和堆栈追踪详解
Apr 18 Javascript
JQuery 又谈ajax局部刷新
Nov 27 jQuery
Vue框架之goods组件开发详解
Jan 25 Javascript
小程序组件之仿微信通讯录的实现代码
Sep 12 Javascript
viewer.js实现图片预览功能
Jun 24 Javascript
openlayers实现地图弹窗
Sep 25 Javascript
vue2.x 通过后端接口代理,获取qq音乐api的数据示例
Oct 30 #Javascript
vue中更改数组中属性,在页面中不生效的解决方法
Oct 30 #Javascript
基于JavaScript实现单例模式
Oct 30 #Javascript
vue解决使用$http获取数据时报错的问题
Oct 30 #Javascript
茶余饭后聊聊Vue3.0响应式数据那些事儿
Oct 30 #Javascript
vue请求服务器数据后绑定不上的解决方法
Oct 30 #Javascript
vue中的mescroll搜索运用及各种填坑处理
Oct 30 #Javascript
You might like
收听困难?教您超简便短波广播抗干扰方法!
2021/03/01 无线电
解析php中如何直接执行SHELL
2013/06/28 PHP
如何解决phpmyadmin导入数据库文件最大限制2048KB
2015/10/09 PHP
图片自动缩小 点击放大
2008/07/07 Javascript
jQuery实现动画效果的实例代码
2013/05/07 Javascript
javascript实现控制浏览器全屏
2015/03/30 Javascript
jstree的简单实例
2016/12/01 Javascript
基于JavaScript实现五子棋游戏
2020/08/26 Javascript
js提取中文拼音首字母的封装工具类
2018/03/12 Javascript
vue element-ui table组件动态生成表头和数据并修改单元格格式 父子组件通信
2019/08/15 Javascript
JS实现网页时钟特效
2020/03/25 Javascript
eslint+prettier统一代码风格的实现方法
2020/07/22 Javascript
在vue中使用cookie记住用户上次选择的实例(本次例子中为下拉框)
2020/09/11 Javascript
python中的实例方法、静态方法、类方法、类变量和实例变量浅析
2014/04/26 Python
Python中函数的用法实例教程
2014/09/08 Python
django 自定义用户user模型的三种方法
2014/11/18 Python
python动态性强类型用法实例
2015/05/09 Python
python 实现一个贴吧图片爬虫的示例
2017/10/12 Python
快速解决vue.js 模板和jinja 模板冲突的问题
2019/07/26 Python
对tensorflow 中tile函数的使用详解
2020/02/07 Python
python中执行smtplib失败的处理方法
2020/07/01 Python
Python爬虫代理池搭建的方法步骤
2020/09/28 Python
CSS3实现的文本3D效果附图
2014/09/03 HTML / CSS
利用CSS3制作简单的3d半透明立方体图片展示
2017/03/25 HTML / CSS
CSS3实现淘宝留白的方法
2020/06/05 HTML / CSS
C#如何进行LDAP用户校验
2012/11/21 面试题
晚宴邀请函范文
2014/01/15 职场文书
《雨霖铃》听课反思
2014/02/13 职场文书
公证委托书模板
2014/04/03 职场文书
团队激励口号
2014/06/06 职场文书
网吧七夕活动策划方案
2014/08/31 职场文书
镇班子对照检查材料思想汇报
2014/09/24 职场文书
教师节寄语2015
2015/03/23 职场文书
安全承诺书格式范本
2015/04/28 职场文书
CSS三大特性继承性、层叠性和优先级详解
2022/01/18 HTML / CSS
进行数据处理的6个 Python 代码块分享
2022/04/06 Python