天天看點

介紹一個能避免 CORS 錯誤的 Chrome 擴充 - Moesif Origin & CORS Changer

在前端開發人員做開發時,當進入到和背景 API 聯調階段時,不可避免會遇到 CORS 錯誤。

介紹一個能避免 CORS 錯誤的 Chrome 擴充 - Moesif Origin & CORS Changer

本文介紹一個 Chrome 擴充,可以用來在開發階段避免 CORS 問題。

注意,這個擴充不能用于生産用途,以免引起 security issue.

Chrome 擴充位址:

https://chrome.google.com/webstore/detail/moesif-origin-cors-change/digfbfaphojjndkpccljibejjbppifbc?hl=en-US
介紹一個能避免 CORS 錯誤的 Chrome 擴充 - Moesif Origin & CORS Changer

我寫了一段簡單的 AJAX JavaScript 調用,來産生 CORS 錯誤:

介紹一個能避免 CORS 錯誤的 Chrome 擴充 - Moesif Origin & CORS Changer

本地用 Chrome 打開該網頁,會遇到預料中的 CORS 錯誤:

介紹一個能避免 CORS 錯誤的 Chrome 擴充 - Moesif Origin & CORS Changer
介紹一個能避免 CORS 錯誤的 Chrome 擴充 - Moesif Origin & CORS Changer

安裝完擴充之後,在設定頁面裡,将 Access-Control-Allow-Origin 設定為 * 即可:

介紹一個能避免 CORS 錯誤的 Chrome 擴充 - Moesif Origin & CORS Changer
介紹一個能避免 CORS 錯誤的 Chrome 擴充 - Moesif Origin & CORS Changer

浏覽器工具欄上,看到 on 的圖示,重新整理網頁,AJAX 調用就能正常執行了:

介紹一個能避免 CORS 錯誤的 Chrome 擴充 - Moesif Origin & CORS Changer

繼續閱讀