WebSocket

Example

// Creating a WebSocket connection
const ws = new WebSocket("ws://localhost:8080");

// Setting up event handlers
ws.onopen = (event) => {
  console.log("Connected to the server");
  ws.send("Hello Server!");
};

ws.onmessage = (event) => {
  console.log(`Received: ${event.data}`);
};

ws.onerror = (event) => {
  console.error("WebSocket error observed:", event);
};

ws.onclose = (event) => {
  console.log(`WebSocket closed: Code=${event.code}, Reason=${event.reason}`);
};

Example

// Basic WebSocket connection
const ws = new WebSocket("ws://localhost:8080");

// WebSocket with protocol specification
const wsWithProtocol = new WebSocket("ws://localhost:8080", "json");

// WebSocket with multiple protocol options (server will select one)
const wsWithProtocols = new WebSocket("ws://localhost:8080", ["json", "xml"]);

// Using URL object instead of string
const url = new URL("ws://localhost:8080/path");
const wsWithUrl = new WebSocket(url);

// WebSocket with headers
const wsWithProtocols = new WebSocket("ws://localhost:8080", {
  headers: {
    "Authorization": "Bearer foo",
  },
});

constructor

new WebSocket(url: string | URL, protocolsOrOptions?: string | string[] | WebSocketOptions): WebSocket

binaryType

binaryType: BinaryType

Returns a string that indicates how binary data from the WebSocket object is exposed to scripts:

Can be set, to change how binary data is returned. The default is "blob".

const ws = new WebSocket("ws://localhost:8080");
ws.binaryType = "arraybuffer";

bufferedAmount

readonly bufferedAmount: number

Returns the number of bytes of application data (UTF-8 text and binary data) that have been queued using send() but not yet been transmitted to the network.

If the WebSocket connection is closed, this attribute's value will only increase with each call to the send() method. (The number does not reset to zero once the connection closes.)

const ws = new WebSocket("ws://localhost:8080");
ws.send("Hello, world!");
console.log(ws.bufferedAmount); // 13

extensions

readonly extensions: string

Returns the extensions selected by the server, if any.

WebSocket extensions add optional features negotiated during the handshake via the Sec-WebSocket-Extensions header.

At the time of writing, there are two registered extensions:

• permessage-deflate: Enables per-message compression using DEFLATE.
• bbf-usp-protocol: Used by the Broadband Forum's User Services Platform (USP).

See the full list at IANA WebSocket Extensions.

Example:

const ws = new WebSocket("ws://localhost:8080");
console.log(ws.extensions); // e.g., "permessage-deflate"

onclose

onclose: ((this: WebSocket, ev: CloseEvent) => any) | null

onerror

onerror: ((this: WebSocket, ev: Event | ErrorEvent) => any) | null

onmessage

onmessage: ((this: WebSocket, ev: MessageEvent) => any) | null

onopen

onopen: ((this: WebSocket, ev: Event) => any) | null

protocol

readonly protocol: string

Returns the subprotocol selected by the server, if any. It can be used in conjunction with the array form of the constructor's second argument to perform subprotocol negotiation.

readyState

readonly readyState: number

Returns the state of the WebSocket object's connection. It can have the values described below.

url

readonly url: string

Returns the URL that was used to establish the WebSocket connection.

CLOSED

readonly CLOSED: number

readonly CLOSED: number

CLOSING

readonly CLOSING: number

readonly CLOSING: number

CONNECTING

readonly CONNECTING: number

readonly CONNECTING: number

OPEN

readonly OPEN: number

readonly OPEN: number

prototype

readonly prototype: WebSocket

close

close(code?: number, reason?: string): void

Closes the WebSocket connection, optionally using code as the WebSocket connection close code and reason as the WebSocket connection close reason.

send

send(data: string | ArrayBufferLike | Blob | ArrayBufferView): void

Transmits data using the WebSocket connection. data can be a string, a Blob, an ArrayBuffer, or an ArrayBufferView.

addEventListener

addEventListener<K extends keyof WebSocketEventMap>(type: K, listener: (this: WebSocket, ev: WebSocketEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void

addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void

removeEventListener

removeEventListener<K extends keyof WebSocketEventMap>(type: K, listener: (this: WebSocket, ev: WebSocketEventMap[K]) => any, options?: boolean | EventListenerOptions): void

removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void