WebSocket: message イベント

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

message イベントは、 WebSocket を通してデータを受け取ったときに発生します。

構文

イベント名を addEventListener() などのメソッドで使用するか、イベントハンドラープロパティを設定するかしてください。

js
addEventListener("message", (event) => {});

onmessage = (event) => {};

イベント型

MessageEvent です。 Event から継承しています。

Event MessageEvent

イベントプロパティ

以下に示したプロパティに加え、親インターフェイスである Event から継承したプロパティも利用できます。

data 読取専用

メッセージ送信者から送信されたデータです。このプロパティの型は、WebSocket メッセージの種類と WebSocket.binaryType の値によって変わります。

  • メッセージの種類が "text" の場合、このフィールドは文字列です。
  • メッセージの種類が "binary" 型の場合、このプロパティの型はこのソケットの binaryType から推測することができます。
    • ArrayBuffer: binaryType"arraybuffer" の場合
    • Blob: binaryType"blob" の場合、これは関連付けられたメディア型がありません(Blob.type"" です).
origin 読取専用

文字列で、メッセージ送信者のオリジンを表します。

MessageEvent インターフェイスのその他のプロパティは存在しますが、 WebSocket API には関係ないため、既定値のままにしています。

js
// Create WebSocket connection.
const socket = new WebSocket("ws://localhost:8080");

// Listen for messages
socket.addEventListener("message", (event) => {
  console.log("Message from server ", event.data);
});

仕様書

Specification
WebSockets Standard
# dom-websocket-onmessage

ブラウザーの互換性

BCD tables only load in the browser

関連情報