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 相关文章推荐
JS实现简单的Canvas画图实例
Jul 04 Javascript
javascript获取url上某个参数的方法
Nov 08 Javascript
ie 7/8不支持trim的属性的解决方案
May 23 Javascript
JQuery中使文本框获得焦点的方法实例分析
Feb 28 Javascript
使用 TypeScript 重新编写的 JavaScript 坦克大战游戏代码
Apr 07 Javascript
jQuery插件datepicker 日期连续选择
Jun 12 Javascript
基于require.js的使用(实例讲解)
Sep 07 Javascript
js使用xml数据载体实现城市省份二级联动效果
Nov 08 Javascript
前后端如何实现登录token拦截校验详解
Sep 03 Javascript
Node.js Buffer模块功能及常用方法实例分析
Jan 05 Javascript
js核心基础之闭包的应用实例分析
May 11 Javascript
原生js基于canvas实现一个简单的前端截图工具代码实例
Sep 10 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
PHP通过API获取手机号码归属地
2015/05/28 PHP
PHP实现的迪科斯彻(Dijkstra)最短路径算法实例
2017/09/16 PHP
Jquery ui css framework
2010/06/28 Javascript
基于dom编程中 动态创建与删除元素的使用
2013/04/17 Javascript
flash遮住div问题的正确解决方法
2014/02/27 Javascript
jquery让返回的内容显示在特定div里(代码少而精悍)
2014/06/23 Javascript
VS2008中使用JavaScript调用WebServices
2014/12/18 Javascript
js中对函数设置默认参数值的3种方法
2015/10/23 Javascript
jQuery提示插件qTip2用法分析(支持ajax及多种样式)
2016/06/08 Javascript
Angularjs---项目搭建图文教程
2016/07/08 Javascript
详解nodejs异步I/O和事件循环
2017/06/07 NodeJs
关于定制FileField中的上传文件名称问题
2017/08/22 Javascript
在create-react-app中使用css modules的示例代码
2018/07/31 Javascript
vue打包相关细节整理(小结)
2018/09/28 Javascript
nodejs基础之buffer缓冲区用法分析
2018/12/26 NodeJs
浅谈Node框架接入ELK实践总结
2019/02/22 Javascript
详解用JS添加和删除class类名
2019/03/25 Javascript
jQuery实现简单弹幕制作
2020/12/10 jQuery
[03:27]《辉夜杯》线下训练营 导师CU和海涛指点迷津
2015/10/23 DOTA
python中关于时间和日期函数的常用计算总结(time和datatime)
2013/03/08 Python
python使用Berkeley DB数据库实例
2014/09/26 Python
编写Python脚本使得web页面上的代码高亮显示
2015/04/24 Python
Python中利用原始套接字进行网络编程的示例
2015/05/04 Python
浅谈python 里面的单下划线与双下划线的区别
2017/12/01 Python
python+opencv实现阈值分割
2018/12/26 Python
python实现二维数组的对角线遍历
2019/03/02 Python
Python使用Tkinter实现滚动抽奖器效果
2020/01/06 Python
python快速安装OpenCV的步骤记录
2021/02/22 Python
CSS3 实现footer 固定在底部(无论页面多高始终在底部)
2019/10/15 HTML / CSS
英国版MAC彩妆品牌:Illamasqua
2018/04/18 全球购物
文员个人求职自荐信
2013/09/21 职场文书
社区母亲节活动记录
2014/03/06 职场文书
应急管理培训方案
2014/06/12 职场文书
2015年资料员工作总结
2015/04/25 职场文书
《我在为谁工作》:工作的质量往往决定生活的质量
2019/12/27 职场文书
Python+SeaTable实现计算两个日期间的工作日天数
2022/07/07 Python