webpack之跨域

先後端分離開發中，本地前端開發調用接口會有跨域問題，通常有如下幾種解決方法：

• 直接啓動服務端項目，再將項目中的資源url指向到前端服務中的靜態資源地址，好處在於由於始終在服務端的環境中進行資源調試，不存在接口的跨域訪問問題，可是缺陷也比較明顯，須要同時啓動兩套環境，還須要藉助nginx，charles等工具進行資源地址的代理轉發，配置比較繁瑣，對開發者對網絡的理解和環境配置要求較高，資源開銷也大；

• CORS跨域：後端接口在返回的時候，在header中加入'Access-Control-Allow-origin':* 等配置，利用跨域資源共享實現跨域，前端部分只要求支持xhr2標準的瀏覽器，可是服務端在請求頭中須要在header中作響應頭配置，在必定程度上仍是對服務端的接口設置有必定的依賴；

• http-proxy：用nodejs搭建本地http服務器，而且判斷訪問接口URL時進行轉發，因爲利用了http-proxy代理的模式進行了轉發，採用的是服務對服務的模式，能較爲完美解決本地開發時候的跨域問題，也是本文中推薦的方式。

 

 

參考：

https://segmentfault.com/a/1190000009266900