在前端開發調試接口的時候都會遇到跨域請求的問題。傳統的方式是使用 Nginx 反向代理解決跨域。比如所有接口都在 a.com 的域下,通過 Nginx 將所有請求代理到 a.com 的域下即可。
使用框架及 Webpack 進行開發時,也可以通過插件實現反向代理。比如使用 Angular 的時候可以通過 proxy.config.json 進行跨域設置。
但是如果開發的測試環境需要登錄認證,則請求時需要攜帶 Cookie 信息。通過 Fetch 發送請求時,可以設置 credentials: 'include' 。而在 Angular 中,則是設置 withCredentials: true 。但是仍然存在跨域的問題。比如本地服務器為 localhost:XXXX,而登錄的 Cookie 信息在 a.com 的域下。所以還是無法解決跨域問題。不知道是不是自己沒有找到更科學的方法。
為了解決這個問題,最后采用了一個相對保守的方法,可以使用 Chrome 插件 modheader 將 Cookie 手動添加到請求頭中。雖然問題解決了,但切換頁面時,還要反復設置插件開關,因為每個頁面的 Cookie 是不一樣的。暫時沒有找到更好的解決辦法。
