Vue.js 中 axios 跨域访问错误问题及解决方法


Posted in Javascript onNovember 21, 2018

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 跨域访问错误问题及解决方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
showModalDialog 和 showModelessDialog
Jan 22 Javascript
jQuery帮助之CSS尺寸(五)outerHeight、outerWidth
Nov 14 Javascript
javascript+mapbar实现地图定位
Apr 09 Javascript
更换select下拉菜单背景样式的实现代码
Dec 20 Javascript
wap手机图片滑动切换特效无css3元素js脚本编写
Jul 28 Javascript
js实现的早期滑动门菜单效果代码
Aug 27 Javascript
微信小程序实现页面跳转传值的方法
Oct 12 Javascript
javascript代码优化的8点总结
Jan 29 Javascript
clipboard.js在移动端复制失败的解决方法
Jun 13 Javascript
vue-cli3+typescript新建一个项目的思路分析
Aug 06 Javascript
vue 需求 data中的数据之间的调用操作
Aug 05 Javascript
JS实现小米轮播图
Sep 21 Javascript
vue  directive定义全局和局部指令及指令简写
Nov 20 #Javascript
详解Vue.js在页面加载时执行某个方法
Nov 20 #Javascript
element vue validate验证名称重复 输入框与后台重复验证 特殊字符 字符长度 及注意事项小结【实例代码】
Nov 20 #Javascript
jQuery 同时获取多个标签的指定内容并储存为数组
Nov 20 #jQuery
一步步教你利用Docker设置Node.js
Nov 20 #Javascript
JS滚轮控制图片缩放大小和拖动的实例代码
Nov 20 #Javascript
vue中的适配px2rem示例代码
Nov 19 #Javascript
You might like
php基础知识:控制结构
2006/12/13 PHP
基于PHP实现假装商品限时抢购繁忙的效果
2015/10/16 PHP
PHP基于SPL实现的迭代器模式示例
2018/04/22 PHP
PDO::inTransaction讲解
2019/01/28 PHP
js arguments.callee的应用代码
2009/05/07 Javascript
Javascript 设计模式(二) 闭包
2010/05/26 Javascript
jQuery结合PHP+MySQL实现二级联动下拉列表[实例]
2011/11/15 Javascript
JS打开层/关闭层/移动层动画效果的实例代码
2013/05/11 Javascript
jQuery插件实现表格隔行换色且感应鼠标高亮行变色
2013/09/22 Javascript
简单的ajax连接库分享(不用jquery的ajax)
2014/01/19 Javascript
javascript实现汉字转拼音代码分享
2015/04/20 Javascript
谈谈对offsetleft兼容性的理解
2015/11/11 Javascript
Bootstrap风格的WPF样式
2016/12/07 Javascript
使用async await 封装 axios的方法
2018/07/09 Javascript
python批量下载图片的三种方法
2013/04/22 Python
python每隔N秒运行指定函数的方法
2015/03/16 Python
Python使用scrapy采集数据时为每个请求随机分配user-agent的方法
2015/04/08 Python
浅谈Python 中整型对象的存储问题
2016/05/16 Python
Python中的time模块与datetime模块用法总结
2016/06/30 Python
解决Python中字符串和数字拼接报错的方法
2016/10/23 Python
Python使用googletrans报错的解决方法
2018/09/25 Python
利用python修改json文件的value方法
2018/12/31 Python
详解Python odoo中嵌入html简单的分页功能
2019/05/29 Python
python 基于TCP协议的套接字编程详解
2019/06/29 Python
Python 将json序列化后的字符串转换成字典(推荐)
2020/01/06 Python
pandas抽取行列数据的几种方法
2020/12/13 Python
requests在python中发送请求的实例讲解
2021/02/17 Python
EVE LOM英国官网:全世界最好的洁面膏
2017/10/30 全球购物
英语文学专业学生的自我评价
2013/10/31 职场文书
建筑专业毕业生推荐信
2013/11/21 职场文书
售后主管岗位职责
2013/12/08 职场文书
党员实事承诺书
2014/03/26 职场文书
群众对十八届四中全会的期盼
2014/10/17 职场文书
创先争优承诺书
2015/01/20 职场文书
故意伤害罪辩护词
2015/05/21 职场文书
初中运动会前导词
2015/07/20 职场文书