vue 專案中瀏覽器跨域的配置

2021-10-10 09:59:42 字數 736 閱讀 7338

1、什麼是跨域

當乙個請求url的協議、網域名稱、埠三者之間任意乙個與當前頁面url不同即為跨域。

2、同源策略

同源策略(same origin policy)是一種約定,它是瀏覽器最核心也最基本的安全功能,如果缺少了同源策略,則瀏覽器的正常功能可能都會受到影響。可以說web是構建在同源策略基礎之上的,瀏覽器只是針對同源策略的一種實現。

3、在專案中配置

開啟專案找到config檔案下的index.js,在js proxytable中配置跨域,**如下

proxytable:

}}

target: 你要跨域的**

secure:如果是https介面,需要配置這個引數

changeorigin: 這個引數是用來迴避跨站問題的,配置完之後發請求時會自動修改http header裡面的host,但是不會修改別的.

pathrewrite:重寫

「 『^/api』: 『/api』」 這裡的配置是正規表示式,以/api開頭的將會被用用『/api』替換掉,假如後台文件的介面是 /api/list/***

前端api介面寫:axios.get(』/api/list/***』) , 被處理之後實際訪問的是:

瀏覽器跨域

前端部分,簡單的封裝乙個promise版的ajax let myajax function headers else xhr.open method,path for let key,value of object.entries headers xhr.send body myajax heade...

瀏覽器跨域

同源策略 同源策略是乙個重要的安全策略,它用於限制乙個origin的文件或者它載入的指令碼如何能與另乙個源的資源進行互動。它能幫助阻隔惡意文件,減少可能被攻擊的媒介。協議 網域名稱 埠號 http伺服器,預設的埠號為80 tcp 木馬executor開放此埠 https securely trans...

瀏覽器設定跨域

由於專案前端使用8001埠,後端使用的8080埠,因此前端呼叫後端介面時需要跨域,在瀏覽器中需要設定跨域,否則會由於跨域安全性導致請求失敗。比如chrome中,需要新建乙個chrome瀏覽器的快捷方式,右鍵選擇屬性 新增 disable web security user data dir c ch...