使用proxyTable解决vue里的跨域问题
由于没有跨域的接口,所以,用8080端口请求8081端口,来模拟跨域。跨域会出现下面报错。

1.找到config文件夹下index.js,在proxyTable对象里复制以下代码:
proxyTable: {
'/apis': {
// 测试环境
target: 'http://localhost:8081', // 接口域名
changeOrigin: true, //是否跨域
pathRewrite: {
'^/apis': '' //需要rewrite重写的,
}
}
},
注意:【更改完这个配置文件后,需要重启项目】
2.使用fetch,vue-resource或axios请求接口
fetch请求:
//用 /apis代替http://localhost:8082
fetch("/apis").then(res=>{
console.log(res);
})
axios请求:
this.$axios.get("/apis").then(res=>{
console.log(res);
})
vue-resource请求:
this.$http.get("/apis").then(res=>{
console.log(res);
});
这样请求,就不会跨域了:

使用proxyTable解决vue里的跨域问题的更多相关文章
- Vue-cli proxyTable 解决开发环境的跨域问题
Vue-cli proxyTable 解决开发环境的跨域问题 proxyTable: { '/list': { target: 'http://api.xxxxxxxx.com', pathRewri ...
- 如何实现vue前端跨域,proxyTable解决开发环境前端跨域问题
在开发环境与后端调试的时候难免会遇到跨域问题,很多人说跨域交给后端解决就好了. 其实不然,前端也有很多方法可以解决跨域,方便也快捷. 常见的有nginx转发.node代理. 在vue项目中常用的是pr ...
- Vue proxyTable 解决开发环境的跨域问题
在 config/index.js 配置文件中,添加 dev: { proxyTable: { '/ssp/withdraw': { target: 'http://dev.home.phiwifi. ...
- 转:Vue-cli proxyTable 解决开发环境的跨域问题
转:http://www.jianshu.com/p/95b2caf7e0da 和后端联调时总是会面对恼人的跨域问题,最近基于Vue开发项目时也遇到了这个问题,两边各自想了一堆办法,查了一堆资料,加了 ...
- 解决vue代理和跨域问题
一.安装vue-resource插件 安装命令:npm install vue-resource --save 安装完之后在根目录下的package.json检查一下插件的版本 在rourer-in ...
- Vue-cli中的proxyTable解决开发环境的跨域问题
https://blog.csdn.net/u012149969/article/details/80288126 https://vuejs-templates.github.io/webpack/ ...
- Vue用axios跨域访问数据
Vue用axios跨域访问数据axios是vue-resource的替代品,vue-resource不再维护.安装axios:npm install axios使用vue-cli开发时,由于项目本身启 ...
- vue开发之跨域请求,请求头not allowed by Access-Control-Allow-Headers,后端cookie session值取不到(二)
原因:你本地的请求ajax的get和post请求:如果你的请求头内放一些可用验证数据Token的时候就会存在跨域请求这是浏览器所不允许的问题: 方案一:后台的接口请求模式都写成jsonp请求,前端去调 ...
- Vue开发环境跨域访问
Vue开发环境跨域访问其他服务器或者本机其他端口,需要配置项目中config/index.js文件,修改如下 module.exports = { dev: { // Paths assetsSubD ...
随机推荐
- HQL中左连接,右连接、内连接
左连接:left join 如A left join B 即取出A表的所有数据,由on条件关联的B表数据,有则显示,没有则为空: 右连接:right join 如 A right join B 即取出 ...
- offsetWidth/offsetHeight,clientWidth/clientHeight与scrollWidth/scrollHeight的区别
offsetWidth/offsetHeight返回值包含content + padding + border,效果与e.getBoundingClientRect()相同 clientWidth/c ...
- 阿里巴巴 Weex
原文链接:https://blog.csdn.net/zz901214/article/details/79168707/ 分享嘉宾:侑夕 阿里巴巴高级前端工程师(上张帅哥的图镇楼,看完,更有动力学习 ...
- pandas,对dataFrame中某一个列的数据进行处理
背景:dataFrame的数据,想对某一个列做逻辑处理,生成新的列,或覆盖原有列的值 下面例子中的df均为pandas.DataFrame()的数据 1.增加新列,或更改某列的值 df[&qu ...
- 编写程序,使用while循环将50到100的整数相加
#include<iostream> int main(int argc, char const *argv[]) { using std::cout; ,b=; ){ a++; b=+b ...
- scrapy meta信息丢失
在做58同城爬二手房时,由于房产详情页内对价格进行了转码处理,所以只能从获取详情页url时同时获取该url对应房产的价格,并通过meta传递给下回调函数 现在问题是,在回调函数中找不到原函数meta信 ...
- c#: WebBrowser 禁止在新窗口打开链接
项目中碰到此需求.几番比对,此为最好的解决方案,聊做备忘. 1.加入Microsoft Internet Controls引用: 项目右键->添加引用->COM->Microsoft ...
- lvm的备份还原及修改UUID
今天在VMware® Workstation 12 Pro虚拟机上克隆了一台Linux虚拟机,无意中发现两台虚拟机blkid一模一样. [root@stau64 ~]# blkid [root@sta ...
- VBA 删除Excel中所有的图片
Sub DeletePic() Dim p As Shape For Each p In Sheet1.Shapes If p.Type = Then ...
- 导致网页顶部空白一行的解决办法【实测有效】
我用织梦做的网站,出现了导致网页顶部空白一行的问题.通过搜索,了解到这原来是UTF-8的BOM的问题. 导致网页顶部空白一行原因 这个问题只会在chrome ...