axios跨域请求步骤:
1.在所要运行的项目文件底下使用npm安装axios,vue-axios到node_modules;
代码: npm install axios vue-axios --save;
2.导入axios,vue-axios,axios需要设置进原型,以防发送请求时需要用;
代码: import Axios from 'axios';
import VueAxios from 'vue-axios'
Vue.use(VueAxios, Axios)
Vue.prototype.$axios=Axios; //设置原型
3.找到config文件下的index.js,在index.js里面找到module.exports 下的dev里面的proxyTable设置代码,如下:
代码:
'/api':{
target:'要请求的地址, 一般都是http://开头,如http://www.baidu.com',
changeOrigin:true, //是否跨域
pathRewrite:{
'^/api':'' //规定请求地址以什么作为开头
}
}
4.在所需要发起请求的页面发起请求, 一般写在方法内:
代码:
this.axios.get/post('/api/search_ajax.php').then((res) => {
"这里是成功的信息"
}).catch((error) => {
"这里是失败的信息"
});
注意: 这里请求的this需要用到箭头函数, 如上。否则这里的this为undefind;
作者留言: 本人是鄙人的一份小总结, 也深知会有不足之处, 还望观览此文章的兄弟姐妹们多批评提建议, 万分感谢!