Socketインスタンス (クライアント側)
Socket
は、サーバーと対話するための基本クラスです。Node.jsのEventEmitterのほとんどのメソッドを継承しており、emit、on、once、offなどがあります。


イベントを送信したり、イベントをリッスンしたりすることに加えて、Socketインスタンスにはアプリケーションで役立つ可能性のあるいくつかの属性があります。
Socket#id
新しい接続ごとに、ランダムな20文字の識別子が割り当てられます。
この識別子は、サーバー側の値と同期されます。
// server-side
io.on("connection", (socket) => {
console.log(socket.id); // x8WIv7-mJelg7on_ALbx
});
// client-side
socket.on("connect", () => {
console.log(socket.id); // x8WIv7-mJelg7on_ALbx
});
socket.on("disconnect", () => {
console.log(socket.id); // undefined
});
接続状態の回復が有効になっていない限り、id
属性は、アプリケーションで使用するためのものではない(またはデバッグ目的のみ)一時的なIDであることに注意してください。その理由は次のとおりです。
- このIDは、再接続するたびに(たとえば、WebSocket接続が切断されたとき、またはユーザーがページを更新したとき)再生成されます。
- 異なるブラウザタブでは、異なるIDが2つあります。
- サーバー上の特定のIDに対してメッセージキューは保存されていません(つまり、クライアントが切断された場合、サーバーからこのIDに送信されたメッセージは失われます)。
代わりに、通常のセッションIDを使用してください(Cookieで送信するか、localStorageに保存してauth
ペイロードで送信します)。
こちらも参照
Socket#connected
この属性は、ソケットが現在サーバーに接続されているかどうかを表します。
socket.on("connect", () => {
console.log(socket.connected); // true
});
socket.on("disconnect", () => {
console.log(socket.connected); // false
});
Socket#io
基になるManagerへの参照。
socket.on("connect", () => {
const engine = socket.io.engine;
console.log(engine.transport.name); // in most cases, prints "polling"
engine.once("upgrade", () => {
// called when the transport is upgraded (i.e. from HTTP long-polling to WebSocket)
console.log(engine.transport.name); // in most cases, prints "websocket"
});
engine.on("packet", ({ type, data }) => {
// called for each packet received
});
engine.on("packetCreate", ({ type, data }) => {
// called for each packet sent
});
engine.on("drain", () => {
// called when the write buffer is drained
});
engine.on("close", (reason) => {
// called when the underlying connection is closed
});
});
ライフサイクル


イベント
Socketインスタンスは、3つの特別なイベントを発生させます。
Socket.IO v3以降、Socketインスタンスは再接続ロジックに関連するイベントを発生させなくなりました。Managerインスタンスで直接イベントをリッスンできます。
socket.io.on("reconnect_attempt", () => {
// ...
});
socket.io.on("reconnect", () => {
// ...
});
詳細については、移行ガイドをご覧ください。
connect
このイベントは、接続および再接続時にSocketインスタンスによって発生します。
socket.on("connect", () => {
// ...
});
ソケットインスタンスが再接続するたびに新しいハンドラーが登録されるため、イベントハンドラー自体をconnect
ハンドラーに登録しないでください。
悪い例 ⚠️
socket.on("connect", () => {
socket.on("data", () => { /* ... */ });
});
良い例 👍
socket.on("connect", () => {
// ...
});
socket.on("data", () => { /* ... */ });
connect_error
error
<Error>
このイベントは、接続に失敗すると発生します。
理由 | 自動再接続? |
---|---|
低レベル接続を確立できない(一時的な障害) | ✅ はい |
ミドルウェア関数でサーバーによって接続が拒否された | ❌ いいえ |
socket.active
属性は、ソケットが小さなランダム化された遅延の後で自動的に再接続を試みるかどうかを示します。
socket.on("connect_error", (error) => {
if (socket.active) {
// temporary failure, the socket will automatically try to reconnect
} else {
// the connection was denied by the server
// in that case, `socket.connect()` must be manually called in order to reconnect
console.log(error.message);
}
});
disconnect
reason
<string>
details
<DisconnectDetails>
このイベントは、切断時に発生します。
socket.on("disconnect", (reason, details) => {
// ...
});
考えられる理由のリストを以下に示します。
理由 | 説明 | 自動再接続? |
---|---|---|
io server disconnect | サーバーがsocket.disconnect()で強制的にソケットを切断しました | ❌ いいえ |
io client disconnect | ソケットがsocket.disconnect()を使用して手動で切断されました | ❌ いいえ |
ping timeout | サーバーがpingInterval + pingTimeout の範囲内でPINGを送信しませんでした | ✅ はい |
transport close | 接続が閉じられました(例:ユーザーが接続を失った、またはネットワークがWiFiから4Gに変更された) | ✅ はい |
transport error | 接続でエラーが発生しました(例:HTTPロングポーリングサイクル中にサーバーが強制終了された) | ✅ はい |
socket.active
属性は、ソケットが小さなランダム化された遅延の後で自動的に再接続を試みるかどうかを示します。
socket.on("disconnect", (reason) => {
if (socket.active) {
// temporary disconnection, the socket will automatically try to reconnect
} else {
// the connection was forcefully closed by the server or the client itself
// in that case, `socket.connect()` must be manually called in order to reconnect
console.log(reason);
}
});
次のイベント名は予約されており、アプリケーションで使用しないでください。
connect
connect_error
disconnect
disconnecting
newListener
removeListener
// BAD, will throw an error
socket.emit("disconnect");
完全なAPI
Socketインスタンスによって公開される完全なAPIはこちらにあります。