最近接受另外一个项目,这个项目没有使用之前设置代理跨域方法,使用了vue2.0新增的axios方法。下面附上如何使用axios设置跨域访问数据。
跳转地址:vue.js实现接口跨域请求,解决No 'Access-Control-Allow-Origin' 问题(设置代理方法)
使用axios,当然需要先安装它。执行 cnpm install axios
安装qs,执行cnpm install qs
引入并且配置axios
调用接口添加如下代码:
header('Access-Control-Allow-Origin:*');
header('Access-Control-Allow-Methods:GET,POST,PATCH,PUT,OPTIONS');
1)get方法这样调用:
this.$fetch(url).then((res) {
//代码
});
2)post方法这样调用:
this.$post(url).then((res) {
//代码
});
3)patch方法这样调用:
this.$patch(url).then((res) {
//代码
});
4)put方法这样调用:
this.$put(url).then((res) {
//代码
});
例子下载地址:http://pan.baidu.com/s/1qXDA7VI, 密码:uzwz
例子代码没有是提供给大家参考修改的,不一定能跑起来。
通过以上配置可以完成axios跨域访问数据问题。