Комментарий: Эта статья содержит подробное резюме использования Postmessage в междоменной коммуникации HTML5. Друзья, которые это нужно, могут прийти и обратиться к этому. Я надеюсь, что это будет полезно для всех.
postmessageportal.html Код страницы
<! Doctype html>
<title> title </title>
<link href = "styles.css">
<link href = "http://apress.com/favicon.ico">
<script> </p> <p> var targetOrigin = "http://22527.vhost20.boxcdn.cn"; </p> <p> var defaulttitle = "portal";
var natificationTimer = null; </p> <p> function messageHandler (e) {
if (e.origin == Targetorigin) {
уведомление (e.data);
} еще {
// Игнорировать сообщения от других истоков
}
} </p> <p> функция SendString (s) {
document.getElementbyId ("widget"). contentwindow.postmessage (s, targettorigin);
} </p> <p>
функция уведомление (сообщение) {
stopbling ();
Blinktitle (сообщение, defaultTitle);
} </p> <p> function stopBlinking () {
if (natificationTimer! == null) {
ClearTimeOut (уведомление о);
}
document.title = defaultTitle;
} </p> <p> function blinktitle (m1, m2) {
document.title = m1;
notificationTimer = setTimeout (Blinktitle, 1000, M2, M1)
} </p> <p> function sendStatus () {
var statustext = document.getElementByid ("statustext"). value;
SendString (statustext);
} </p> <p> function LoadDemo () {
document.getElementById ("sendbutton"). addEventListener ("Щелкни", SendStatus, True);
document.getElementById ("stopbutton"). addeventListener ("click", stopbling, true);
SendStatus ();
}
window.addeventListener ("Load", LoadDemo, True);
window.addeventlistener ("message", messageHandler, true); </p> <p> </script> </p> <p> <h1> Cross Domain Communication </h1>
Информация о передаче: <input type = "text" value = "Online">
<Кнопка> Подтвердите </button>
<iframe src = "http://22527.vhost20.boxcdn.cn/postmessagewidget.html"> </iframe>
<p>
<Tood> Остановить титул мигает </button>
</p>
Код PostmessageWidget.html страница
<! Doctype html>
<title> title </title>
<link href = "styles.css">
<Script> </p> <p> var targetOrigin = "http://www.weixiu0376.cn"; </p> <p> // todo Whitelist Array </p> <p> function messageHandler (e) {
if (e.origin === "http://www.weixiu0376.cn") {
document.getElementbyId ("status"). TextContent = e.data;
} еще {
// Игнорировать сообщения от других истоков
}
} </p> <p> функция SendString (s) {
window.top.postmessage (s, targettorigin);
} </p> <p> function LoadDemo () {
document.getElementById ("actionButton"). addEventListener ("Щелкни",
function () {
var messageText = document.getElementById ("messageText"). Value;
SendString (MessageText);
}, true); </p> <p>}
window.addeventListener ("Load", LoadDemo, True);
window.addeventListener ("Message", MessageHandler, True); </p> <p> </script>
<p> Показать информацию о приеме: <strong> </strong> <p>
<div>
<input type = "text" value = "заполнить содержимое сообщения">
<Кнопка> Отправить сообщение </button>
</div>