一、同源策略
要理解跨域,我們首先要知道什么是同源策略。百度百科上這樣定義同源策略:同源策略(Same origin policy)是一種約定,它是瀏覽器最核心也最基本的安全功能,如果缺少了同源策略,則瀏覽器的正常功能可能都會(huì)受到影響。可以說Web是構(gòu)建在同源策略基礎(chǔ)之上的,瀏覽器只是針對(duì)同源策略的一種實(shí)現(xiàn)。
何謂同源:如果兩個(gè)URL的域名、協(xié)議、端口相同,則表示他們同源。
瀏覽器的同源策略,限制了來自不同源的"document"或腳本,對(duì)當(dāng)前"document"讀取或設(shè)置某些屬性。 (白帽子講web安全[1])。根據(jù)這個(gè)策略,a.com域名下的JavaScript無法跨域操作b.com域名下的對(duì)象。比如,baidu.com域名下的頁面中包含的JavaScript代碼,不能訪問google.com域名下的頁面內(nèi)容。
JavaScript必須嚴(yán)格遵循瀏覽器的同源策略,包括Ajax(事實(shí)上,Ajax也是由JavaScript組成)。通過XMLHttpRequest對(duì)象實(shí)現(xiàn)的Ajax請(qǐng)求,不能向不同的域提交,比如,在abc.test.com下的頁面,不能向def.test.com提交Ajax請(qǐng)求。運(yùn)用了同源策略之后,用戶就能確保自己正在查看的頁面確實(shí)來自于正在瀏覽的域。
同源策略在現(xiàn)實(shí)應(yīng)用中是十分重要的。假設(shè)攻擊者利用Iframe把真正的銀行登錄頁面嵌到他的頁面上,當(dāng)用戶使用真實(shí)的用戶名、密碼登錄時(shí),該頁面就可以通過JavaScript讀取到用戶表單中的內(nèi)容,這樣用戶名和密碼信息就被泄漏了。
在瀏覽器中,<script>、<link>、<img>、<iframe>等標(biāo)簽都可以加載跨域資源,不受同源策略限制,但是通過src加載的資源,瀏覽器限制了javascript的權(quán)限,不能進(jìn)行各種的讀寫。從而,即使請(qǐng)求發(fā)了,敏感數(shù)據(jù)回來了,也是取不到的。
二、postMessage實(shí)現(xiàn)跨域
語法:window.postMessage(msg,targetOrigin)
window: 指目標(biāo)窗口,可能是window.frames屬性的成員或者由window.open方法創(chuàng)建的窗口
message:要發(fā)送的消息,html5規(guī)范中提到該參數(shù)可以是JavaScript的任意基本類型或可復(fù)制的對(duì)象,然而并不是所有瀏覽器都做到了這點(diǎn)兒,部分瀏覽器只能處理字符串參數(shù),所以我們?cè)趥鬟f參數(shù)的時(shí)候需要使用JSON.stringify()方法對(duì)對(duì)象參數(shù)序列化,在低版本IE中引用json2.js可以實(shí)現(xiàn)類似效果
targetOrigin:“目標(biāo)域“,包括:協(xié)議、主機(jī)名、端口號(hào)。若指定為”*“,則表示可以傳遞給任意窗口,指定為”/“,則表示和當(dāng)前窗口的同源窗口。
獲取postMessage傳來的消息:為頁面添加onmessage事件
onmessage事件接受一個(gè)參數(shù)e,它是一個(gè)event對(duì)象。
e的幾個(gè)重要屬性:
1、data:postMessage傳遞過來的msg
2、發(fā)送消息的窗口對(duì)象
3、origin:發(fā)送消息窗口的源(協(xié)議+主機(jī)+端口號(hào))
來寫一個(gè)簡(jiǎn)單的demo:
http://source.com/source.html用來發(fā)送數(shù)據(jù):
http://target.com/target.html用來接收數(shù)據(jù):
運(yùn)行結(jié)果如下:
點(diǎn)擊發(fā)送按鈕的時(shí)候,target.html將會(huì)受到發(fā)送的消息。
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助。
原文:http://www.cnblogs.com/MarcoHan/p/5245519.html
標(biāo)簽:大同 延邊 赤峰 林芝 泰州 保定 萍鄉(xiāng)
巨人網(wǎng)絡(luò)通訊聲明:本文標(biāo)題《Html5 postMessage實(shí)現(xiàn)跨域消息傳遞》,本文關(guān)鍵詞 ;如發(fā)現(xiàn)本文內(nèi)容存在版權(quán)問題,煩請(qǐng)?zhí)峁┫嚓P(guān)信息告之我們,我們將及時(shí)溝通與處理。本站內(nèi)容系統(tǒng)采集于網(wǎng)絡(luò),涉及言論、版權(quán)與本站無關(guān)。