關於vue-resource 跨域請求的異常處理方法

 

當你啓動一個vue項目時，項目會運行在一個webpack的服務上，因此此時去訪問其餘端口或者是其餘地址時，屬於跨域請求，故會報異常。

 

has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

 

當出現此異常時，不要慌，解決方法很簡單。

首先，打開項目的webpack.config.js文件

在當前頁面搜索 

devServer:

 

而後在此節點下添加如下這個對象：

name能夠隨意命名，不過最好按必定的格式命名，待會兒後面會用到。如下是此對象的代碼

proxy: {

'/api': {

target: 'http://localhost:64938/',

changeOrigin: true,

pathRewrite:{

"/api":""

}

　　}

}

添加對象後，回到咱們調用請求的頁面，修改對應報錯的請求url，把本來的url的請求跟地址 也就是 如：http://localhost:64938/ 替換爲 /api  ，而後重啓項目！重啓項目！重啓項目！

重啓項目，便可訪問！