使用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 ...
随机推荐
- Redis部署说明
一.普通部署 将Redis-x64-3.2.100解压,修改配置文件,一般不需要修改,直接使用默认,具体要修改可自行百度. 打开命令行,定位到解压目录,执行命令: redis-server.exe r ...
- Jupyter Notebook 快捷键使用指南
因为使用Jupyter Notebook用鼠标选择菜单影响效率,遂将快捷命令记录于此 转自:http://blog.konghy.cn/2017/05/04/jupyter-notebook-hotk ...
- 禁止网站显示文件目录列表的方法(htaccess)
主机默认都可以把网站内的文件以列表的形式显示出来: 修改.htaccess文件 在空间网站的根目录下找到.htaccess文件,空间路径一般在/home/YouUsername/public_html ...
- Leetcode中sort排序遇到的一些问题
class Solution { public: static bool cmp(vector<int>a,vector<int>b) { ]-a[]<b[]-b[]; ...
- 解决time_wait过多
需要真正找出问题或瓶颈,但调整单机参数能临时解决:(收集自:https://www.cnblogs.com/dadonggg/p/8778318.html) 编辑内核文件/etc/sysctl.con ...
- Ubuntu 16.04 安装Kinect V2驱动
1.下载源代码 git clone https://github.com/OpenKinect/libfreenect2.git 2.依赖项安装 sudo apt-get install build- ...
- jQuery插件的一些想法
之前在用ant-design和MUI的时候是一个系统的插件,应有尽有,当然jQuery也有系统性的插件,最近的项目没有用,所以一些需要插件的东西,需要哪种,找哪种,然后再引入项目中,首先百度搜索这类插 ...
- java_32 SQLyog中创建数据库表
USE test; /*1.创建账务表 id name mony*/ CREATE TABLE zhangwu(id INT PRIMARY KEY AUTO_INCREMENT, sname VAR ...
- GlusterFS
1. GlusterFS概述 GlusterFS是Scale-Out存储解决方案Gluster的核心,它是一个开源的分布式文件系统,具有强大的横向扩展能力,通过扩展能够支持数PB存储容量和处 ...
- tomcat设置开机自动启动
windows下: 1 命令cmd 进入 磁盘: 回车 2 tomcat\bin目录 回车 3 service.bat install (注:tomcat一定要有service.bat ...