vue axios跨域请求
程序员文章站
2024-02-18 16:49:58
...
1、安装axios
npm install --save axios
2、在main.js引入axios
import axios from 'axios'
Vue.prototype.$http = axios
3、修改config/index.js 如下:
proxyTable: {
'/api': {
target: 'http://192.168.1.40:8080',
secure: false, // 是否HTTPS接口
changeOrigin: true,// 是否跨域
pathRewrite: {
'^/api': '/static/json'
}
}
}
4、调用接口
<script>
import axios from 'axios';
// 如果要跨域的话, 对axios进行一些设置,当前使用的是跨域的
const axiosInstance = axios.create({
//baseURL:'http://192.168.1.193:8081',
headers: {'Content-Type':'application/json;charset=utf-8'}, // 设置传输内容的类型和编码
});
export default {
created() {
this.postData();
},
methods:{
// 接口调用
postData() {
var url = "../地址";
// 跨域访问
axiosInstance.post(url,{}).then( res => {
console.log(res);
}).catch( error => {
console.log('请求失败')
});
},
}
}
</script>
上一篇: 简单理解Vue中的nextTick
下一篇: 后台设计可能遇到的问题(1)