vue專案請求後台介面跨域

2021-10-02 00:08:40 字數 942 閱讀 1753

vue專案在本地除錯中,我們經常用localhost來啟動,但是當你請求後台介面時,比如:則顯示跨域,這裡開啟config下的index.js檔案,dev下面有乙個屬性proxytable,配置:

proxytable:               

}},

這樣配置以後呢,看後端的介面字首有沒有/api,有的話,你的介面請求字首就要加上『/api』,(也可以在上面rewrite重寫的時候重寫成』/api』,你就不用手動加了):

/room/num/          //  你本來請求的介面

/api/room/num/ // 你配置以後的請求介面

沒有就不管了。

如果你封裝了公共請求js檔案,(如果沒有封裝,請看這篇博文)則在請求url前面拼接上/api即可:

var base = "/api"

// 傳送請求

export function fetchpost (url, params) ,

err =>

).catch(err => )

})}

這樣在頁面中請求介面寫你原本介面即可,比如:

this.$fetchpost('/room/num', obj).then(res => )
這樣寫是和打包上線沒有關係的,僅僅是你在除錯測試的時候。

這樣跨域的問題就解決了,還有一種辦法就是用nginx**,配置本地監聽的埠和網域名稱的時候,寫成localhost:

server 

location ~ .*\..*

location /

}

這樣配置好,除錯專案前,啟動專案,啟動nginx,然後在瀏覽器開啟:localhost:9003,即可除錯專案。

Vue跨域請求後台不帶cooking

我們跨域手動新增cooking import cookies from js cookie 設定cookie 建立乙個cookie,在整個站點有效 cookies.set name value 建立乙個7天後過期的cookie,在整個站點中有效 cookies.set name value 建立乙個...

Vue 介面請求支援跨域

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

Vue 介面跨域請求除錯proxyTable

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