1. 程式人生 > 程式設計 >關於vue 專案中瀏覽器跨域的配置問題

關於vue 專案中瀏覽器跨域的配置問題

1、什麼是跨域
當一個請求url的協議、域名、埠三者之間任意一個與當前頁面url不同即為跨域。

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

3、在專案中配置
開啟專案找到config檔案下的index.js,在js proxyTable中配置跨域,程式碼如下

 proxyTable: {
   '/api': {
     target: 'http://***.com',//你要跨域的網址
    secure: true,changeOrigin: true,pathRewrite: {
     '^/api': '/api'
    }
   }
  }

target: 你要跨域的網址
secure:如果是https介面,需要配置這個引數
changeOrigin : 這個引數是用來回避跨站問題的,配置完之後發請求時會自動修改http header裡面的host,但是不會修改別的.
pathRewrite:重寫
“ ‘^/api': ‘/api'” 這裡的配置是正則表示式,以/api開頭的將會被用用‘/api'替換掉,假如後臺文件的介面是 /api/list/xxx
前端api介面寫:axios.get('/api/list/xxx') , 被處理之後實際訪問的是:http://news.baidu.com/api/list/xxx

總結

到此這篇關於關於vue 專案中瀏覽器跨域的配置問題的文章就介紹到這了,更多相關vue 瀏覽器跨域配置內容請搜尋我們以前的文章或繼續瀏覽下面的相關文章希望大家以後多多支援我們!