1. 程式人生 > >vue——前端跨域

vue——前端跨域

***針對的是不同域名、不同協議的跨域:

1、找到config檔案中開發環境的配置檔案——dev.env.js,在裡面將要跨域的域名配置進去

 

2、找到config檔案中線上環境的配置檔案——prod.env.js,在裡面將要跨域的域名配置進

 

 3、配置完後,還需要在config的index.js中配置對外的跨域域名,target的值為要跨域的域名(其他檔案才能正常找到這個域名)

 

注:^api 預設替代了你要跨域的介面的域名

所以,在呼叫跨域介面的地方,跨域直接以 /api/***的形式去訪問

 

 這個時候,還會出現一個問題,明明寫的是post的方法,但是為貓會被瀏覽器解析為OPTIONS

說到底,是這個跨域的問題沒有徹底解決,還有一個頑症待治理

簡單的說,就是“非簡單請求”在跨域時,瀏覽器會預設自動幫你發一個OPTIONS請求,到伺服器端請求伺服器確認該請求的合法性,伺服器端必須得有相應的路由處理該請求,並認真返回200響應,然後瀏覽器才會再次發出正常的、你需要的請求。

這個你可以和你們的後端商量,當然,如果後端大哥說會影響網站安全性這個問題,你也可以自己判斷,降低請求複雜程度,將“複雜請求”降至“簡單請求”

找到介面的攔截器部分,加上url的判斷,不是本伺服器上的域名,就降級(我的就一個跨域的域名,所以用的是==判斷的)

 

這是我處理的方法,百度借鑑,但是一步一步走下來,另有收貨,希望對有需要的人有幫助