typesocket
v1.1.0
Published
TypeScript WebSockets library
Downloads
144
Readme
Are you a React.js user? You might be interested in the useTypeSocket React hook.
Used in filedrop-web and whiteboard-web.
API is mostly stable. It may change in the future, but the changes shouldn't be breaking.
Installation
TypeSocket is available on npm, you can install it with either npm or yarn:
npm install typesocket
# or:
yarn install typesocket
Example usage
const socket = new TypeSocket<MessageModel>(url, {
maxRetries: 10,
});
socket.on('connected', () => {
console.log('connected!');
socket.send({
type: 'ping',
});
});
socket.on('message', (message: MessageModel) => {
console.log(message.type);
});
socket.on('disconnected', () => {
console.log('disconnected');
});
socket.connect();
With Redux:
I use TypeSocket with Redux and Redux-Saga like this:
export const socketMiddleware = (url: string) => {
return (store: MiddlewareAPI<any, any>) => {
const socket = new TypeSocket<MessageModel>(url);
socket.on('connected', () =>
store.dispatch({ type: ActionType.WS_CONNECTED })
);
socket.on('disconnected', () =>
store.dispatch({ type: ActionType.WS_DISCONNECTED })
);
socket.on('message', message =>
store.dispatch({ type: ActionType.WS_MESSAGE, value: message })
);
socket.connect();
return (next: (action: any) => void) => (action: any) => {
if (
action.type &&
action.type === ActionType.WS_SEND_MESSAGE &&
socket.readyState === 1
) {
socket.send(action.value);
}
return next(action);
};
};
};
Events
You can attach event listeners to an instance of TypeSocket
with .on
:
socket.on('message', message => {
console.log(message);
});
connected
Emitted when a connection gets established.
disconnected
Emitted when the socket is disconnected.
permanentlyDisconnected
Emitted when the socket is permanently disconnected, for example:
- Server gracefully closes the connection.
- Client gracefully closes the connection.
disconnect
is called.- Retry amount has been exceeded.
message
Emitted when a valid message is received.
The only argument contains an object of type T
with a deserialized message.
invalidMessage
Emitted when an invalid message is received.
The only argument contains an object of type string | ArrayBuffer
with a raw message.
rawMessage
Emitted when any message is received.
The only argument contains an object of type string | ArrayBuffer
with a raw message.
binaryMessage
Emitted when a binary message (with an ArrayBuffer) is received.
The only argument contains an object of type ArrayBuffer
.
API
on(eventType: 'message', listener: (message: T) => void);
on(eventType: 'rawMessage' | 'invalidMessage', listener: (message: string | ArrayBuffer) => void);
on(eventType: 'binaryMessage', listener: (message: ArrayBuffer) => void);
on(eventType: 'connected' | 'disconnected' | 'permanentlyDisconnected', listener: () => void);
off(eventType: 'message', listener: (message: T) => void);
off(eventType: 'rawMessage' | 'invalidMessage', listener: (message: string | ArrayBuffer) => void);
on(eventType: 'binaryMessage', listener: (message: ArrayBuffer) => void);
off(eventType: 'connected' | 'disconnected' | 'permanentlyDisconnected', listener: () => void);
constructor(private url: string, options?: TypeSocketOptions);
connect();
disconnect();
send(data: T);
sendRaw(data: string | ArrayBuffer | Blob | ArrayBufferView);
get readyState();