proxyTable的配置
在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的配置的更多相关文章
- webpack的proxytable的配置
这个一定不能忘记了/rest/后面的/,否则就是404找不到接口 这样的实现效果是 this.axios.post('/api/delShare', qs.stringify({'Id':Number ...
- vue-cli#2.0 webpack 配置分析
目录结构: ├── README.md ├── build │ ├── build.js │ ├── check-versions.js │ ├── dev-client.js │ ├── dev-s ...
- 构建:vue项目配置后端接口服务信息
背景 vue-cli脚手架生成的webpack标准模板项目 HTTP库使用axios 一.开发环境跨域与API接口服务通信 整体思路: 开发环境API接口请求baseURL为本地http://loca ...
- 前端如何使用proxyTable和nginx解决跨域问题
最近经常遇到跨域的问题,有时候问题虽然解决了,但是还是会有些模棱两可概念不清,于是在网上看了一些教程结合实际使用,做个笔记. 1.跨域原因 浏览器的限制 跨域(协议/域名/端口的不同) XMLHttp ...
- vue 一些webpack的配置详解
最近一直在忙着做项目 本来想养成一个经常跟新博客的习惯 , 但是实在是太难了 , 每天加班到10点多 .8点能下班都是最好的了 , 小公司真不好待呀 分享一下最近半年的vue心得吧 我的项目是在他的基 ...
- vue proxyTable代理 解决开发环境的跨域问题
如果我们项目请求的地址为 htttp://xxxx.com/a/b/c 可以设置代理为: dev:{ assetsSubDirectory: 'static',// 静态资源文件夹 assetsPub ...
- Vue 项目代理设置的优化
Vue 项目代理设置的优化 Vue 类的项目开发中项目结构基本都是类似于 Vue-cli 生成的方式, 这种方式开发中,最常用到的模式是开启代理进行 mock 调试或远程调试, 也就是使用了 Vue- ...
- Vue全家桶(Vue-cli、Vue-route、vuex)
摘要 学习本篇之前要具备一定的vue基础知识,可以先看一下Vue基础(环境配置.内部指令.全局API.选项.内置组件) 1.Vue-cli Vue-cli是vue官方出品的快速构建单页应用的脚手架,这 ...
- 详解 vue-cli 的打包配置文件代码(给大家写写注释)
一.前言 对于webpack基础不好,node指令不通的童鞋.估计对自己搭建Vue.react脚手架是相当头疼的,有种无从下手的感觉.然而,从头看这2块,耗时太长,而且说实话得练才行,不练练手看不明白 ...
随机推荐
- 吴裕雄--天生自然python机器学习:机器学习简介
除却一些无关紧要的情况,人们很难直接从原始数据本身获得所需信息.例如 ,对于垃圾邮 件的检测,侦测一个单词是否存在并没有太大的作用,然而当某几个特定单词同时出现时,再辅 以考察邮件长度及其他因素,人们 ...
- Linux基本操作_20191117
VMware和Ubuntu的安装, 想来想去,还是需要安装,不能老是使用Windows的,后面还有很多都要用到Linux系统的,这个可以说是开发人员必备的了, 基本的使用: 1,Windows下面C: ...
- 代码审计中的XSS
0x00 背景 XSS漏洞也叫跨站脚本攻击,是Web漏洞中最常见的漏洞,原理与SQL注入相似,通过来自外部的输入直接在浏览器端触发.XSS漏洞通常被入侵者用来窃取Cookie等,本文以代码审计的形式研 ...
- VS工程的相对路径写法
最近搭建一个VS工程的框架,为了让所有人都能直接使用,要使用相对路径,下面的几种常见路径的写法: 1.两个点“..\”表示在工程文件(*.vcxproj)的上一级目录. 2.一个点“.\”则表示和工程 ...
- linux清除cache的方法
1 Linux下内存占用多的原因 当linux第一次读取一个文件运行时,一份放到一片内存中cache起来,另一份放入运行程序的内存中,正常运行,当程序运行完,关闭了,cache中的那一分却没有释放, ...
- Tricks of Android's GUI
Tricks of Android's GUI */--> Tricks of Android's GUI 1 layoutweight In LinearLayout, the default ...
- [LC] 1099. Two Sum Less Than K
Given an array A of integers and integer K, return the maximum S such that there exists i < j wit ...
- Linux查看后台任务,关闭后台任务
jobs查看后台任务, kill %num关闭相应的后台任务
- laravel-事件
1.注册事件以及监听器 首先我们需要在 app/Providers/目录下的EventServiceProvider.php中注册事件监听器映射关系,如下: /** * The event liste ...
- 关于JS对象原型prototype与继承,ES6的class和extends · kesheng's personal blog
传统方式:通过function关键字来定义一个对象类型 1234567891011 function People(name) { this.name = name}People.prototype. ...