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 相关文章推荐
用JavaScript将从数据库中读取出来的日期型格式化为想要的类型。
Aug 15 Javascript
深入理解JavaScript系列(49):Function模式(上篇)
Mar 04 Javascript
PHP结合jQuery实现红蓝投票功能特效
Jul 22 Javascript
js removeChild 方法深入理解
Aug 16 Javascript
javascript九宫格图片随机打乱位置的实现方法
Mar 15 Javascript
深入理解Commonjs规范及Node模块实现
May 17 Javascript
微信小程序自定义组件之可清除的input组件
Jul 17 Javascript
vue插槽slot的理解和使用方法
Apr 03 Javascript
jsonp跨域获取百度联想词的方法分析
May 13 Javascript
ElementUI Tree 树形控件的使用并给节点添加图标
Feb 27 Javascript
vue+openlayers绘制省市边界线
Dec 24 Vue.js
vue中data里面的数据相互使用方式
Jun 05 Vue.js
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
全国FM电台频率大全 - 8 黑龙江省
2020/03/11 无线电
比较好用的PHP防注入漏洞过滤函数代码
2012/04/11 PHP
php颜色转换函数hex-rgb(将十六进制格式转成十进制格式)
2013/09/23 PHP
个人写的PHP验证码生成类分享
2014/08/21 PHP
让ThinkPHP支持大小写url地址访问的方法
2014/10/31 PHP
PHP读取CSV大文件导入数据库的实例
2017/07/24 PHP
php连接mysql数据库最简单的实现方法
2019/09/24 PHP
通过正则表达式实现表单验证是否为中文
2014/02/18 Javascript
一张表格告诉你windows.onload()与$(document).ready()的区别
2014/05/16 Javascript
javascript结合Canvas 实现简易的圆形时钟
2015/03/11 Javascript
JS实现光滑展开合拢的菜单效果代码
2015/09/16 Javascript
jQuery+css实现的时钟效果(兼容各浏览器)
2016/01/27 Javascript
jQuery中选择器的基础使用教程
2016/05/23 Javascript
JS结合bootstrap实现基本的增删改查功能
2016/07/22 Javascript
利用JS屏蔽页面中的Enter按键提交表单的方法
2016/11/25 Javascript
JavaScript中日常收集常见的10种错误(推荐)
2017/01/08 Javascript
Javascript 使用ajax与C#获取文件大小实例详解
2017/01/13 Javascript
js实现图片加载淡入淡出效果
2017/04/07 Javascript
浅谈vue在html中出现{{}}的原因及解决方式
2020/11/16 Javascript
[15:20]DOTA2-DPC中国联赛 正赛 Elephant vs Aster 选手采访
2021/03/11 DOTA
用python + hadoop streaming 分布式编程(一) -- 原理介绍,样例程序与本地调试
2014/07/14 Python
Python中使用glob和rmtree删除目录子目录及所有文件的例子
2014/11/21 Python
python3序列化与反序列化用法实例
2015/05/26 Python
python如何重载模块实例解析
2018/01/25 Python
Python实现Kmeans聚类算法
2020/06/10 Python
python重试装饰器的简单实现方法
2019/01/31 Python
美国办公用品购物网站:Quill.com
2016/09/01 全球购物
Lookfantastic德国官网:英国知名美妆购物网站
2017/06/11 全球购物
美国著名的女性内衣零售商:Frederick’s of Hollywood
2018/02/24 全球购物
Bally澳大利亚官网:瑞士奢侈品牌
2018/11/01 全球购物
专题民主生活会对照检查材料思想汇报
2014/09/29 职场文书
2015年组织委员工作总结
2015/04/23 职场文书
2016幼儿教师自荐信范文
2016/01/28 职场文书
redis实现排行榜功能
2021/05/24 Redis
Python3 多线程(连接池)操作MySQL插入数据
2021/06/09 Python
Mysql 文件配置解析介绍
2022/05/06 MySQL