跨域是指乙個域下的文件或指令碼試圖去請求另乙個域下的資源，這裡跨域是廣義的。 其實我們通常所說的跨域是狹義的，是由瀏覽器同源策略限制的一類請求場景。吶，說起跨域就不得不提一下同源策略，那什麼是同源策略呢？
同源策略（瀏覽器提供的一種安全的執行環境）
同源策略限制了從同乙個源載入的文件或指令碼如何與來自另乙個源的資源進行互動。這是乙個用於隔離潛在惡意檔案的重要安全機制同源策略限制以下幾種行為：
倘若沒有了同源策略限制的介面請求，很容易受到csrf攻擊和xss攻擊
倘若沒有了同源策略限制的dom查詢，會很容易被竊取資訊
所謂同源是指"協議+網域名稱+埠"三者相同，即便兩個不同的網域名稱指向同乙個ip位址，也非同源。要說起跨域產生的場景，就不得不要了解一下url位址了
乙個完整url包含一下幾部分：
協議部分protocol：該url的協議部分為http，這代表網頁使用的是http協議。在internet中可以使用多種協議，如https，ftp，file等。在http後面的//為分隔符
驗證authentication：該url的驗證部分為username:password，這種 url 是不贊成使用的。原因看這裡o(∩_∩)o
網域名稱部分（主機位址）hostname埠部分port：該url的埠部分為8080，跟在網域名稱後面的是埠，網域名稱和埠之間使用:作為分隔符。埠不是乙個url必須的部分，如果省略埠部分，將採用預設埠80
虛擬目錄部分:該url的虛擬目錄為/news/，從網域名稱後的第乙個/開始到最後乙個/為止，是虛擬目錄部分。虛擬目錄也不是乙個url必須的部分。
路徑部分pathname: 該url的路徑部分為index.asp，從網域名稱後的最後乙個/開始到？為止，是檔名部分，如果沒有?，則是從網域名稱後的最後乙個/開始到#為止，是檔案部分，如果沒有？和#，那麼從網域名稱後的最後乙個/開始到結束，都是檔名部分。檔名部分也不是乙個url必須的部分，如果省略該部分，則使用預設的檔名
查詢(引數)部分serarch: 該url的查詢部分為boardid=5&id=24618&page=1，從？開始到#為止之間的部分為引數部分，又稱搜尋部分、查詢部分。引數可以允許有多個引數，引數與引數之間用&作為分隔符。
錨部分: 該url的錨部分為name，從「#」開始到最後，都是錨部分。錨部分也不是乙個url必須的部分
好了，話題拉回來，讓我們來看一下跨域的場景
url說明
是否允許通訊
同一網域名稱，不同檔案或路徑
允許
同一網域名稱，不同埠
不允許
同一網域名稱，不同協議
不允許
網域名稱和網域名稱對應相同ip
不允許
主域相同，子域不同
不允許
不同網域名稱
不允許
前端**：
$('#btn').click(function());
function query(res)
router.get('/jsonp', (req, res) => = req.query;
let data = ;
data = json.stringify(data);
res.end(`$($)`);
});
此方案僅限主域相同，子域不同的跨域應用場景。
實現原理：兩個頁面都通過js強制設定document.domain為基礎主域，就實現了同域。
具體實現：a域：a.html -> b域：b.html -> a域：c.html，a與b不同域只能通過hash值單向通訊，b與c也不同域也只能單向通訊，但c與a同域，所以c可通過parent.parent訪問a頁面所有物件。
var proxy = function(url, callback) else if (state === 0)
};// 獲取資料以後銷毀這個iframe，釋放記憶體；這也保證了安全（不被其他域frame js訪問）
function destoryframe()
};// 請求跨域b頁面資料
proxy('', function(data));
中間**頁，與a.html同域，內容為空即可。
b.html：()postmessage()方法接受兩個引數:
// 啟http服務
// 監聽socket連線
socket.listen(server).on('connection', function(client) );
// 斷開處理
client.on('disconnect', function() );
});那些年曾談起的跨域
前端常見跨域解決方案（全）
正確面對跨域，別慌
不要再問我跨域的問題了
最熟悉的陌生人 MVC
以前開發ios程式的時候用的最多的是mvc的設計模式，這種軟體架構的模式是由 模型 model 螢幕中展示的 檢視 view 如何展示的 和控制器 controller 程式的資料，本質 三部分組成。具體的使用很簡單，本質上來說就是 模型 model 響應使用者請求並返回響應資料，檢視 view 負...
熟悉的陌生人 軟體工程
熟悉的陌生人 軟體工程 去年暑假到現在是乙個蛻變的過程！從軟體工程到uml到設計模式再到三層架構 其實這些都屬於軟工的範疇 這是一條充滿艱辛，充滿曲折的道路，一路走來，感觸頗多。進入提高班，再次接觸軟體工程，讓我覺得既熟悉又陌生。造成這種讓人糾結的狀態只能怪自己當時太無知。沒有好好聽大學老師講課。不...
熟悉的陌生人 軟體工程
熟悉的陌生人 軟體工程 去年暑假到現在是乙個蛻變的過程！從軟體工程到uml到設計模式再到三層架構 其實這些都屬於軟工的範疇 這是一條充滿艱辛，充滿曲折的道路，一路走來，感觸頗多。進入提高班，再次接觸軟體工程，讓我覺得既熟悉又陌生。造成這種讓人糾結的狀態只能怪自己當時太無知。沒有好好聽大學老師講課。不...