關於前端跨域這個老生長談的問題，解決方案也是鋪天蓋地，但大家是否真正從原理上到實踐已經完全掌握了呢？小郭今天將總結所有的跨域解決方案，讓你在面試中收穫滿分。
本文將從跨域場景到跨域方案逐一說明，重點突出最常用跨域方案，讓你工作開發不用愁。
由於本文涉及篇幅較長，因此分上下集講述，力爭把最全面的跨域問題分享給大家。
概念
廣義跨域：一個域下的文檔或腳本試圖去請求另一個域下的資源，這被稱作為廣義上跨域。
舉例：
- 資源跳轉： A鏈接、重定向、表單提交
- 資源嵌入： <link>、
通過iframe的src屬性由外域轉向本地域，跨域數據即由iframe的window.name從外域傳遞到本地域。這個就巧妙地繞過了瀏覽器的跨域訪問限制，但同時它又是安全操作。但操作依然複雜，不推薦使用
方案五：postMessage跨域
postMessage是HTML5 XMLHttpRequest Level 2中的API，且是為數不多可以跨域操作的window屬性之一，他可以解決這類問題：頁面和其打開的新窗口的數據傳遞；多窗口之間消息傳遞；頁面與嵌套的iframe消息傳遞。
使用方法：postMessage(data,origin)方法接受兩個參數
data： html5規範支持任意基本類型或可複製的對象，但部分瀏覽器只支持字符串，所以傳參時最好用JSON.stringify()序列化。
origin： 協議+主機+端口號，也可以設置為"*"，表示可以傳遞給任意窗口，如果要指定和當前窗口同源的話設置為"/"。請求頁：http://www.domain1.com/a.html
<code><iframe>
/<code>接收頁：http://www.domain2.com/b.html
<code>/<code>
該方法雖然直接通過window屬性解決跨域，但其適用場景有限，因此不推薦。
上集內容到此結束。
總結一下：本篇主要帶大家弄清楚跨域的概念及跨域問題的來源，同時介紹了五種前端跨域問題的解決方案，但以上方案由於不同因素限制，所以均不推薦使用。下集內容將講述前端最常用的幾種跨域解決方案，千萬不要錯過。
我是小郭，想了解更多前端知識歡迎關注公眾號“一郭鮮”，小郭將帶你在前端海洋裡馳騁。另外，文章也將同步更新到公眾號，謝謝大家關注。"
閱讀更多 一郭鮮 的文章
