Vue 介面跨域請求除錯proxyTable

2021-10-01 03:59:50 字數 924 閱讀 7655

在專案開發的時候,介面聯調的時候一般都是同網域名稱下,且不存在跨域的情況下進行介面聯調,但是當我們現在使用vue-cli進行專案打包的時候,我們在本地啟動伺服器後,比如本地開發服務下是 http://localhost:8080 這樣的訪問頁面,但是我們的介面位址是 http://localhost:3000這樣的介面位址,我們這樣直接使用會存在跨域的請求,導致介面請求不成功,

vue通過proxytable來解決,因此我們需要在打包的時候配置一下,我們進入config/index.js進行如下配置即可:

/***配置表,在這裡可以配置特定的請求**到對應的api介面*/

/* 下面的例子將**請求 /api/getnewslist  到 http://localhost:3000/getnewslist*/

proxytable:

}

配置好後,該如何使用呢?使用vue-resouce傳送ajax獲取資料

this.$http.get('/api/getnewslist')//代替http://localhost:3000/getnewslist

.then((res) => , (err) => )

配置好**後如果請求不到資料,可以訪問原本的伺服器介面 http://localhost:3000/getnewslist,如果直接訪問伺服器介面可以請求到資料那麼就是請求**配置有問題,否則就是其它問題。

注意:配置好後,一定要npm run dev 重新啟動專案!!!

Vue 介面請求支援跨域

在不同域之間訪問是比較常見,在本地除錯訪問遠端伺服器。這就是有域問題。在 config index.js 配置檔案中 dev proxytable proxyconfig.proxylist,css sourcemaps off by default because relative paths a...

vue專案請求後台介面跨域

vue專案在本地除錯中,我們經常用localhost來啟動,但是當你請求後台介面時,比如 則顯示跨域,這裡開啟config下的index.js檔案,dev下面有乙個屬性proxytable,配置 proxytable 這樣配置以後呢,看後端的介面字首有沒有 api,有的話,你的介面請求字首就要加上 ...

vue請求和跨域

proxy 其他安裝 vue本身不支援傳送ajax請求,需要使用vue resource axios等外掛程式實現 axios是乙個基本promise的http請求客戶端,用來傳送請求,也是vue2.0官方推薦的,同時不再對vue resource進行更新和維護安裝axios npm install...