vue下axios和fetch跨域請求


1.在config的index.js下面進行常用跨域配置代碼;
proxyTable: {
'/apis': { //使用"/api"來代替"http://xxxx.cn" target: 'http://xxxx.cn', //源地址 (接口域名) changeOrigin: true, //改變源 (是否跨域) pathRewrite: { '^/apis': 'http://xxxx.cn' //路徑重寫 (正常請求接口的簡寫) } } }
2.利用axios的post方式組件內發起請求
this
.$axios.post("/apis/test/testToken.php",{username:"hello",password:"123456"}) .then(res => { console.log(res) }).catch(err=>{ console.log(err) })
3.這幾個axios常用設置可在封裝axios的api中寫上也可以在main.js寫上
axios.defaults.headers.common['token'] = "f4c902c9ae5a2a9d8f84868ad064e706" //設置header里面的token依據需求設置 axios.defaults.headers.post["Content-type"] = "application/json" //設置請求頭可要可不要 Vue.prototype.$http = axios //全局可要使用this.$http來發起請求
4.使用fetch API的形式請求接口數據
fetch("/apis/test/testToken.php", { method: "post", headers: { "Content-type": "application/json", token: "f4c902c9ae5a2a9d8f84868ad064e706" }, body: JSON.stringify({ username: "henry", password: "321321" }) }) .then(result => { console.log(result) return result.json() }) .then(data => { console.log(data) })

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM