onmessageイベント
例
新しいEventSourceオブジェクトを作成し、更新を送信するページのURLを指定します。
更新を受信するたびに、onmessageイベントが発生します。onmessageイベントが発生したら、受信したデータをid = "myDIV"の<div>要素に入れます。
var source = new EventSource("demo_sse.php");
source.onmessage = function(event) {
document.getElementById("myDIV").innerHTML += event.data + "<br>";
};
以下の「自分で試してみてください」の例をもっと見てください。
定義と使用法
onmessageイベントは、メッセージがイベントソースを介して受信されたときに発生します。
onmessageイベントのイベントオブジェクトは、次のプロパティをサポートしています。
- data-実際のメッセージが含まれています
- origin-イベントを呼び出したドキュメントのURL
- lastEventId-イベントストリームで最後に表示されたメッセージの識別子
関連イベント:
サーバー送信イベントの詳細については、 HTML5サーバー送信イベントチュートリアルを参照してください。
ブラウザのサポート
表の数字は、イベントを完全にサポートする最初のブラウザーバージョンを示しています。
Event | |||||
---|---|---|---|---|---|
onmessage | 9.0 | Not supported | 6.0 | 5.0 | 11.0 |
構文
object.onmessage = function(){myScript};
addEventListener()メソッドの使用:
object.addEventListener("message", myScript);
注: addEventListener ()メソッドは、Internet Explorer8以前のバージョンではサポートされていません。
技術的な詳細
泡: | 番号 |
---|---|
キャンセル可能: | 番号 |
イベントタイプ: | イベント |
その他の例
例
onmessageイベントを呼び出したドキュメントのURLを取得します。
var source = new EventSource("demo_sse.php");
source.onmessage = function(event) {
document.getElementById("myDIV").innerHTML = event.origin;
};
結果は次のようになります。
https://www.w3schools.com/