導航:首頁 > 網路設置 > vue網路設置方法

vue網路設置方法

發布時間:2022-12-19 14:18:38

『壹』 vue開發中有幾種網路請求方式用哪一種

選擇什麼網路模塊?Vue中發送網路請求有非常多的方式,那麼,在開發中,如何選擇呢?

選擇一:傳統的ajax是基於XMLHTTPRequest(XHR)
為什麼不用他呢?
非常好解釋,配置和調用方式等非常混亂
編碼起來非常蛋疼

選擇二:JQuery-Ajax 相遇與傳統的ajax非常好用
為什麼不用他?
Vue項目中不適用jquery了。
專門適用ajax專門引用jquery,麻煩

選擇三: vue-resource 體積小
為什麼不用他?
不再更新。

選擇四:axios 用起來方便
功能特點:
在瀏覽器中發送xmlhttprequest請求
在node.js中發送http請求
支持promiseApi
攔截請求和響應
轉換請求和響應數據

『貳』 vue 前端設置跨域多代理

在項目開發的時候經常會遇到後端提供的多個服務請求地址域名或埠號不一致的情況這時候就需要前端設置多個proxy跨域代理,本文以vue-element-admin為例展示步驟如下:
1: 配置環境變數 .env.development

2: 配置項目根目錄下的vue.config.js 找到devServer

PS:注意VUE_APP_BASE_API 放在數組的最後一個,如果你VUE_APP_BASE_API跟我一樣設置為'' 的話,這樣才不會被代理的虛擬path覆蓋!

3: 找到項目中管理請求地址的文件 src/api/proxy.js (proxy.js 是我隨便起的名字😄)

打開proxy.js

proxy_api 就是你之前在步驟1:中定義的虛擬path
VUE_APP_BASE_API_PROXY = '/proxy-api'
const url = (path) => (proxy_api + path) 一個路徑處理函數,參數是'/xx/xxx/fetch/list',return (proxy_api + path)

需要額外注意的是我在配置環境變數 .env.development的時候基礎api設置的是空:

所以不需要在src/utils/request.js 中對代理的請求進行攔截

如果你為VUE_APP_BASE_API設置了虛擬path路徑,那麼就需要在src/utils/request.js為這個虛擬路徑配置攔截,比較麻煩比不建議這么做。

至此跨域多代理已經設置完了,本文中設置兩個代理一個基礎代理VUE_APP_BASE_API,一個額外代理VUE_APP_BASE_API_PROXY,默認情況下走基礎代理,當請求匹配到匹'/proxy-api' 時走額外代理~

閱讀全文

與vue網路設置方法相關的資料

熱點內容
主機有線網路虛擬機無線網路 瀏覽:487
公牛無線網路面板說明書 瀏覽:291
r1希望成為網路中的dr路由器 瀏覽:995
聯通新訊鏈接電腦沒有網路 瀏覽:100
還原網路設置對試玩任務有用沒 瀏覽:242
網路電視自帶的直播軟體 瀏覽:734
有線網路安全手抄報圖片 瀏覽:66
網路系統軟體有哪些 瀏覽:259
網路信號差會影響wifi嗎 瀏覽:578
手機銀行提示網路錯誤 瀏覽:439
手機為什麼沒有網路就用不了地圖 瀏覽:757
網路軟體包括哪五個 瀏覽:707
看電視移動網路老卡怎麼辦 瀏覽:585
工業網路技術多少錢 瀏覽:480
網路電視哪個有廣東體育台 瀏覽:288
除了網線還能用上什麼網路 瀏覽:674
電信的無線網路密碼是多少 瀏覽:874
侵犯計算機網路域名 瀏覽:284
安廣網路寬頻肥西一年多少錢 瀏覽:479
只看微信的話網路速度限制多少 瀏覽:900

友情鏈接