keycloak~從login-status-iframe頁面總結如何跨域傳值~續

張佔嶺發表於2023-12-28
跨域

keycloak~從login-status-iframe相關文章，可閱讀我的這兩篇keycloak~從login-status-iframe頁面總結如何跨域傳值 ,keycloak~對接login-status-iframe頁面判斷使用者狀態變更 。

什麼是跨域

跨域（Cross-Origin）是指在Web開發中，當一個資源（比如JavaScript、CSS、圖片等）來自於不同域名、協議或埠的網站時，就會出現跨域情況。瀏覽器的同源策略（Same-Origin Policy）限制了不同源之間的互動，包括JavaScript的跨域訪問、Cookie的跨域傳送等。

具體來說，如果一個頁面的來源與另一個資源的來源在域名、協議、埠號中有任何一個不同，就被認為是跨域請求。例如，從a.com的頁面向b.com傳送AJAX請求、透過iframe嵌入不同域名的頁面、在JavaScript中嘗試讀取不同域名的Cookie等都屬於跨域操作。

跨域問題是由瀏覽器的安全策略引起的，它的存在是為了防止惡意網站利用使用者的瀏覽器對其他網站進行攻擊。在實際開發中，為了解決跨域問題，我們可以使用CORS（跨域資源共享）、JSONP（JSON with Padding）、代理伺服器、iframe訊息傳遞等技術來實現不同源之間的資料互動。

主域的判斷

  • 頂級域名相同，二級域名不同，主域視為相同，如a.user.com,b.user.com，它們主域是user.com
  • 頂級域名相同，但埠不同，也是主域相同，如a.user.com,a.user.com:8080，它們主域是user.com
  • 頂級域名相同，二級域名不同，埠也不同，也是主域相同，如a.user.com:8080,b.user.com:8081，它們主域是user.com

跨域判斷

  • 主域不同是跨域：a.user.com,b.product.com
  • 主域相同，子域不同，也是跨域：a.user.com,b.user.com
  • 域名相同，埠不同，也是跨域：a.user.com:8081,a.user.com:8081

跨域中的iframe的cookie值

例項程式碼

  • b.user.com
<script>
alert(document.cookie);
</script>
  • a.user.com和a.shop.com
<iframe src="https://b.user.com" id="my-iframe" style="display:none"></iframe>

程式碼在不同場景下測試結論

  • 主域名相同user.com
    • 執行a.user.com，可以透過alert輸出b.user.com下的cookie內容
    • 執行a.user.com:8081,可以透過alert輸出b.user.com下的cookie內容
  • 主域名不同shop.com和user.com
    • 執行a.shop.com，在列印的alert中，b.user.com的cookie是null

主域名相同

主域名不同

相關文章