【原创】Vue.js 中 axios 跨域访问错误
1、假如访问的接口地址为 http://www.test.com/apis/index.php (php api 接口)
2、而开发地址为http://127.0.0.1:8080,当axios发起请求时,出现如下错误:
Failed to load http://www.test.com/apis/index.php?&act=login: The value of the 'Access-Control-Allow-Origin' headerin the response must not be the wildcard '*' when the request's credentials mode is 'include'. Origin 'http://127.0.0.1:8080' is therefore not allowed access. The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.
解决方法:
1、修改config/index.js, 修改 proxytable
proxyTable: {
'/apis': {
target: 'http://www.test.com/apis/', // 接口地址
changeOrigin: true,
pathRewrite: {
'^/apis': '' //需要rewrite重写的,
}
}
},
2、重启 npm run dev (很重要,否则不生效)
3、访问接口(访问时通过代理转发的,有点类似APACHE的urlrewrite,不需要完整http://www.test.com网址。)
this.$api.get('/apis/index.php?act=login', {
"act": "login"
}, response => {
//success
},error => {
//error
}
);
大功告成,成功解决错误,另外:PHP端不需要做任何的header设置,网上很多教程胡说八道,根本不能实现跨域。
【原创】Vue.js 中 axios 跨域访问错误的更多相关文章
- 关于vue项目中axios跨域的解决方法(开发环境)
1.在config文件中修改index.js proxyTable: { "/api":{ target: 'https://www.baidu.com/muc/',//你需要跨域 ...
- Vue用axios跨域访问数据
Vue用axios跨域访问数据axios是vue-resource的替代品,vue-resource不再维护.安装axios:npm install axios使用vue-cli开发时,由于项目本身启 ...
- vue.js学习之 跨域请求代理与axios传参
vue.js学习之 跨域请求代理与axios传参 一:跨域请求代理 1:打开config/index.js module.exports{ dev: { } } 在这里面找到proxyTable{}, ...
- js中各种跨域问题实战小结(二)
这里接上篇:js中各种跨域问题实战小结(一) 后面继续学习的过程中,对上面第一篇有稍作休整.下面继续第二部分: -->5.利用iframe和location.hash -->6.windo ...
- js中各种跨域问题实战小结(一)
什么是跨域?为什么要实现跨域呢? 这是因为JavaScript出于安全方面的考虑,不允许跨域调用其他页面的对象.也就是说只能访问同一个域中的资源.我觉得这就有必要了解下javascript中的同源策略 ...
- JS中实现跨域的方法总结
今天早上在地铁看了点基础知识的考察题,看到了一个JS跨域的问题,仔细想了想自己脑子里竟然只剩下jsonp跨域和用nginx反向代理进行跨域,想着还有别的几种方法,就是想不起来,这个人呢,一上岁数这个脑 ...
- react axios 跨域访问一个或多个域名
1.react + axios 跨域访问一个域名 配置非常简单,只需要在当前的 package.json 文件里面配置: "proxy":"http://iot-demo ...
- 001_Three.js中的跨域问题
001_Three.js中的跨域问题 [情景描述]: 在初始化模型,引入字体和纹理皮肤图片的时候,由于跨域问题,出现了以下提示: Access to image at 'file:///F:/User ...
- 前端vue开发中的跨域问题解决,以及nginx上线部署。(vue devServer与nginx)
前言 最近做的一个项目中使用了vue+springboot的前后端分离模式 在前端开发的的时候,使用vue cli3的devServer来解决跨域问题 上线部署则是用的nginx反向代理至后台服务所开 ...
随机推荐
- 通过winrm使用powershell远程管理服务器
原文地址 在Linux中,我们可以使用安全的SSH方便的进行远程管理.但在Windows下,除了不安全的Telnet以外,从Windows Server 2008开始提供了另外一种命令行原创管理方式, ...
- poj 3267 The Cow Lexicon (动态规划)
The Cow Lexicon Time Limit: 2000MS Memory Limit: 65536K Total Submissions: 8167 Accepted: 3845 D ...
- libyuv库的使用
libyuv是Google开源的实现各种YUV与RGB之间相互转换.旋转.缩放的库.它是跨平台的,可在Windows.Linux.Mac.Android等操作系统.x86.x64.arm架构上进行编译 ...
- java开发环境配置(win8 64位)
自己配置java环境时是自己上网找资料装的,,有讲的好的也有讲的不是很清晰的,,自己也入了几个坑..所以在这里自己整理了下win8配置JDK的教程. 下载JDK 首先我们需要下载java开发工具包JD ...
- 【待解决】An internal error occurred during: "Launching baiduTest1". java.lang.NullPointerException
编写的一个Java类,以junit运行可以正常执行,以testNG执行就报如下错误 解决方法:
- h5-6 canvas
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- hiho一下第76周《Suzhou Adventure》
我是菜鸡,我是菜鸡,我是菜鸡....重要的事说三遍 算是第一次做树形dp的题吧,不太难.. 园林构成一棵树,root为1,Hi从root出发,有k个园林必须玩,每个园林游玩后会得到权值w[i],最多玩 ...
- 【docker】python: can't open file 'helloworld.py': [Errno 13] Permission denied
运行容器提示权限问题 docker run -v $PWD/myapp:/usr/src/myapp -w /usr/src/myapp python:3.5 python helloworld. ...
- mysql.connector 事务总结
mysql.connector事务总结: connection.autocommit = 0 (默认值) 事务处理 使用 connection.commit()方法 #!/usr/bin/env py ...
- Irrlicht 1.8.4 + Win7 + VC2015 + x64 +OpenGL编译
1. 下载irrlicht1.8.4 https://nchc.dl.sourceforge.net/project/irrlicht/Irrlicht%20SDK/1.8/1.8.4/irrlich ...