Vue + axios 訪問后台 ip 調用服務的問題


首先我們提出幾個問題:

  1. 本地項目啟動端口 localhost:8080  , 你想去連接后台開發人員的 ip 調接口, 后台ip+端口號+訪問api,比如說是 http://10.220.146.82:8991/dispatch/orderList , 此時必然被引起跨域。就是你使用 localhost:8080 去訪問 http://10.220.146.82:8991,瀏覽器同源策略限制,必須配置跨域。

  2. 當你配置了跨域發現沒生效,為什么呢? 此時查看項目使用了 axios.defaults.baseURL = "http://abc.com:8090"。跨域被覆蓋了。查看控制台,訪問的還是遠程路徑的請求地址:

  http://abc.com:8090/dispatch/orderList。那么問題來了。

  問題一: axios.defaults.baseURL 優先級是否比 proxyTable 中配置的高?

  問題二: axios.defaults.baseURL 是項目遠程服務地址,微服務項目各個模塊服務地址都不一樣,不可能逐個配置怎么辦?

  問題三: 如果用你的服務地址重寫了 axios.defaults.baseURL ,你的其他服務(比如登錄)就不可用了,登陸不進去,訪問不到目標頁面怎么辦?

  問題四: 如果前端項目使用了 vue + qiankun 的微服務方案,proxyTable  怎么配置?


 

下面對以上問題進行解答:

  問題一: axios.defaults.baseURL 會覆蓋 proxyTable 配置的 url。所以 baseURL 是肯定要注釋掉的。何時注釋?  如果你不會配置 proxyTable 請查看  vuue-cli2.0 請查看https://www.jianshu.com/p/758f2c798f0a  vue-cli3.0 請查看 https://blog.csdn.net/lj90019002/article/details/81116879

  問題二: 部分接口訪問可能要犧牲掉。

  問題三: 【登錄后再去注釋】注釋可以解決問題二,問題三。

  問題四:  vue + qiankun 方案項目 proxyTable 在主項目中生效,所以只需要配置主項目。如果你對 vue + qiankun 不了解請查看 https://segmentfault.com/a/1190000021547996

 

  


免責聲明!

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



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