在dev环境下面:

proxyTable: {
'/api': {
target: 'http://api.douban.com/v2', //主域名,以前我都写192.168.2.57:80,这里跨域了
changeOrigin: true, //允许跨域
pathRewrite: {
'^/api': ''
}
//重写路径,其实这里就是和上面的target拼接起来
}
}

以前的老项目里是写成这样的:

proxyTable: {
"/middleware": {
target: "http://192.168.2.57:80",
pathRewrite: {
'^/middleware': '/patient/1116/guangji/middleware' //上下拼接,组成完整的请求路径
},
changeOrigin: true,
}
}

配合axios使用:

//在main.js中:  

Vue.prototype.HOST = '/api'     

//将api设置成全局属性,然后再给每个请求地址引用一下。
//这里必须这样写,我试了一下如果不在全局注册api的话,它还是会去请求192.168.2.57:8888下面的地址 //在代码里: this.axios.get(this.HOST + '/movie/in_theaters').then((response) => {
console.log(response);
})
//请求的接口是:http://api.douban.com/v2/movie/in_theaters 拼接起来的

注意:

1.这个方法只是讲了proxyTable应该怎样配置。

2.只能用在开发环境中,生产环境怎么用我还要再研究一下。

3.千万别忘了在main.js中引入api作为全局变量。

proxyTable的配置的更多相关文章

  1. webpack的proxytable的配置

    这个一定不能忘记了/rest/后面的/,否则就是404找不到接口 这样的实现效果是 this.axios.post('/api/delShare', qs.stringify({'Id':Number ...

  2. vue-cli#2.0 webpack 配置分析

    目录结构: ├── README.md ├── build │ ├── build.js │ ├── check-versions.js │ ├── dev-client.js │ ├── dev-s ...

  3. 构建:vue项目配置后端接口服务信息

    背景 vue-cli脚手架生成的webpack标准模板项目 HTTP库使用axios 一.开发环境跨域与API接口服务通信 整体思路: 开发环境API接口请求baseURL为本地http://loca ...

  4. 前端如何使用proxyTable和nginx解决跨域问题

    最近经常遇到跨域的问题,有时候问题虽然解决了,但是还是会有些模棱两可概念不清,于是在网上看了一些教程结合实际使用,做个笔记. 1.跨域原因 浏览器的限制 跨域(协议/域名/端口的不同) XMLHttp ...

  5. vue 一些webpack的配置详解

    最近一直在忙着做项目 本来想养成一个经常跟新博客的习惯 , 但是实在是太难了 , 每天加班到10点多 .8点能下班都是最好的了 , 小公司真不好待呀 分享一下最近半年的vue心得吧 我的项目是在他的基 ...

  6. vue proxyTable代理 解决开发环境的跨域问题

    如果我们项目请求的地址为 htttp://xxxx.com/a/b/c 可以设置代理为: dev:{ assetsSubDirectory: 'static',// 静态资源文件夹 assetsPub ...

  7. Vue 项目代理设置的优化

    Vue 项目代理设置的优化 Vue 类的项目开发中项目结构基本都是类似于 Vue-cli 生成的方式, 这种方式开发中,最常用到的模式是开启代理进行 mock 调试或远程调试, 也就是使用了 Vue- ...

  8. Vue全家桶(Vue-cli、Vue-route、vuex)

    摘要 学习本篇之前要具备一定的vue基础知识,可以先看一下Vue基础(环境配置.内部指令.全局API.选项.内置组件) 1.Vue-cli Vue-cli是vue官方出品的快速构建单页应用的脚手架,这 ...

  9. 详解 vue-cli 的打包配置文件代码(给大家写写注释)

    一.前言 对于webpack基础不好,node指令不通的童鞋.估计对自己搭建Vue.react脚手架是相当头疼的,有种无从下手的感觉.然而,从头看这2块,耗时太长,而且说实话得练才行,不练练手看不明白 ...

随机推荐

  1. 编译安装 logstash-output-jdbc

    环境 mac https://github.com/theangryangel/logstash-output-jdbc logstash-plugin install logstash-output ...

  2. 九成AI企业亏损,人工智能商业落地为何这么难?

    自1956年"人工智能"一词诞生于"达特茅斯会议"后,前者就始终在不断向前推进.虽然中间经历了不少低谷和寒潮,但总算挺了过来.60多年后,人工智能在当下呈现突飞 ...

  3. python——删除列表中的元素

    在python中,删除列表元素的方法有三种,分别为remove(),del(),pop()函数 (1)remove() >>> name = ['小明','小华','小红','小李' ...

  4. MySQL中的GIS几何函数和空间分析函数

    MySQL空间扩展不仅提供了空间数据的存储能力,而且还具备一些空间运算能力,这些功能通过MySQL内建的几何函数实现.最简单的几何函数昨天已经有所涉及,也就是转换WTK的GEOMFROMTEXT和AS ...

  5. 乐观锁(Optimistic Lock)

    乐观锁(非阻塞)指不通过锁表来解决并发问题,一般情况下表数据都会加入一个version字段,对该字段进行比较更新来保证数据的一致性. 这里写了个demo,应该可以说明乐观锁的问题. public cl ...

  6. mac android sdk manager 无法更新(被墙)

    http://www.androiddevtools.cn/ 一句话,相见恨晚!! 想把以前的旧安卓项目拿到MAC上 环境就卡住了,以前的包是4.4的,想试试5.0的,更新不动 Android Too ...

  7. SHELL用法六(Find语句)

    1.SHELL编程Find语句案例实战 1)SHELL编程四剑客工具:Find.Grep.Sed.Awk,通过四剑客可以完成常规Linux指令无法完成或者比较复杂的功能,学好SHELL编程四剑客有助于 ...

  8. CAD安装未完成,某些产品无法安装的解决方法

    CAD提示安装未完成,某些产品无法安装该怎样解决呢?,一些朋友在win7或者win10系统下安装CAD失败提示CAD安装未完成,某些产品无法安装,也有时候想重新安装CAD的时候会出现本电脑window ...

  9. 状压DP小拼盘

    有的DP题,某一部分的状态只有两种,选或不选. 开数组记录,代价太大,转移不方便. 状态压缩意为,用 “0/1“ 表示 “选/不选“ . 把状态表示为二进制整数. There are 10 kinds ...

  10. PHP PSR-2 代码风格规范

    代码风格规范 本篇规范是 PSR-1 基本代码规范的继承与扩展. 本规范希望通过制定一系列规范化PHP代码的规则,以减少在浏览不同作者的代码时,因代码风格的不同而造成不便. 当多名程序员在多个项目中合 ...