前言
因為學習跨域需要配置本地服務器，可能會比較麻煩，所以自己根據網上的博客寫了大多數跨域的簡單demo，可以自己在`本地運行`，而且`不用配置服務器`。自己對於跨域的理解剛開始也僅僅在於網上的博客文章，通過寫這些可以本地運行的demo讓我對跨域有了更直面的理解，希望這些demo對你們有幫助，有錯誤的話歡迎指正，歡迎PR。

github地址: https://github.com/FatDong1/cross-domain

多種跨域demo

• CROS跨域
• JSONP跨域
• postMessage跨域，html5新API
• window.name跨域
• location.hash跨域
• document.domain跨域
• 後端proxy代理跨域
• • demo1，通過使用`http-proxy-middleware插件`設置後端的代理
  • demo2，不使用插件去配置代理，更加原生地解釋了proxy跨域的原理
• websocket跨域

優點

• 通過本地運行demo，可以快速理解多種跨域。
• demo簡單易懂，內附許多註釋。
• 學習門檻低。

原理
通過nodeJS的express框架在3000端口和3001端口分別生成服務器，在3000端口和3001端口進行跨域訪問。

項目運行環境
全局安裝

• nodeJS
• npm
• git

學習這些demo需要的基礎

• git clone項目到本地
• 一點點nodeJS知識，註釋裏面大部分有講解node知識，如果不會nodeJS也是可以去學習這些demo的。

學習建議
在學習其中一種跨域方法的時候，建議邊運行項目裏的demo，邊在網上搜索博客文章學習這種跨域方法，這樣有助於快速並且深入理解跨域。鑒於網上有很多文章詳細講述跨域知識，只是少了可以本地運行的demo，所以這裏就不再贅述跨域知識。

最後
如果demo裏面有什麽錯誤，歡迎拍磚，如果有什麽地方解釋不清楚，可以在segmentfault私信我或者在gihtub提issue。

本文已同步到我的博客-- https://www.xuhaodong.cn/articles/53

快速入門各種跨域