javascript使用web proxy來實現ajax cross-domain通訊

世有因果知因求果發表於2016-09-20

在現代瀏覽器中,都強加了對javacript程式碼的訪問限制,比如一個頁面的js無法向非同源的url實現ajax請求,獲得資料。在這時,是瀏覽器端會報錯:

No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:3000' is therefore not allowed access. The response had HTTP status code 401.

對於server端一般也會對這種安全策略加以實施,比如laravel在這種情況下,就會返回

401 Unauthorized

很多時候,我們是需要這種機制的。那麼有什麼好的方法嗎?

一個比較常見的解決方案是使用web proxy

圖例以下幾種場景:

 

正常情況下,如果js的origin和js要發起的ajax屬於同一個網站,則沒有任何問題。

 

  

如果不同源,則block

通過proxy來workaround這個問題:

參考下面的文章

https://developer.yahoo.com/javascript/howto-proxy.html

 

相關文章