---title: Chat.Clientsidebar_label: Clientsidebar_position: 0---import MethodOff from ../../_common/_method_off.mdx;import MethodOn from ../../_common/_method_on.mdx;import MethodOnce from ../../_common/_method_once.mdx;import MethodRemoveAllListeners from ../../_common/_method_removealllisteners.mdx;You can use the Client object to build a messaging system into the browser.Example usage:jsimport { Chat } from @signalwire/js;const chatClient = new Chat.Client({ token: , // get this from the REST APIs});await chatClient.subscribe([mychannel1, mychannel2]);chatClient.on(message, (message) => { // prettier-ignore console.log(Received, message.content, on, message.channel, at, message.publishedAt);});await chatClient.publish({ channel: mychannel1, content: hello world,});## Constructors### constructor• **new Client**(chatOptions)Creates a new Chat client.#### Parameters| Name | Type | Description || :------------------ | :------- | :----------------------------------------------------------------------------------------------------------- || chatOptions | Object | - || chatOptions.token | string | SignalWire Chat token that can be obtained from the [REST APIs](pathname:///rest/generate-a-new-chat-token). |#### Examplejsimport { Chat } from @signalwire/js;const chatClient = new Chat.Client({ token: ,});## Methods### disconnect▸ **disconnect**(): voidDisconnects this client. The client will stop receiving events and you will need to create a new instance if you want to use it again.#### Returnsvoid#### Examplejsclient.disconnect();---### getAllowedChannels▸ **getAllowedChannels**(): PromiseReturns the channels that the current token allows you to subscribe to.#### ReturnsPromiseAn object whose keys are the channel names, and whose values are thepermissions. For example:js{ my-channel-1: { read: true, write: false }, my-channel-2: { read: true, write: true },}#### Examplesjsconst chatClient = new Chat.Client({ token: ,});const channels = await chatClient.getAllowedChannels();console.log(channels);---### getMemberState▸ **getMemberState**(params): Promise<{ channels: Record }\>Returns the states of a member in the specified channels.#### Parameters| Name | Type | Description || :----------------- | :--------------------- | :------------------------------------------- || params | Object | - || params.channels? | string \| string[] | Channels for which to get the state. || params.memberId | string | Id of the member for which to get the state. |#### ReturnsPromise<{ channels: Record }\>#### Examplejsconst s = await chatClient.getMemberState({ channels: [chan1, chan2], memberId: my-member-id,});s.channels.length; // 2s.channels.chan1.state; // the state object for chan1---### getMembers▸ **getMembers**(params): Promise<{ members: [ChatMemberEntity](./chatmemberentity)[] }\>Returns the list of members in the given channel.#### Parameters| Name | Type | Description || :--------------- | :------- | :------------------------------------------------ || params | Object | - || params.channel | string | The channel for which to get the list of members. |#### ReturnsPromise<{ members: [ChatMemberEntity](./chatmemberentity)[] }\>#### Examplejsconst m = await chatClient.getMembers({ channel: my-channel });m.members.length; // 7m.members[0]; // { id: ..., channel: ..., state: ... }---### getMessages▸ **getMessages**(params): Promise<{ cursor: [PagingCursor](#pagingcursor) ; messages: [ChatMessageEntity](./chatmessageentity)[] }\>Returns the list of messages that were sent to the specified channel.#### Parameters| Name | Type | Description || :--------------- | :------------------------------ | :------------------------------------------ || params | Object | - || params.channel | string | Channel for which to retrieve the messages. || params.cursor? | [PagingCursor](#pagingcursor) | Cursor for pagination. |#### ReturnsPromise<{ cursor: [PagingCursor](#pagingcursor) ; messages: [ChatMessageEntity](./chatmessageentity)[] }\>#### Examplejsconst m = await chatClient.getMessages({ channel: chan1 });m.messages.length; // 23m.messages[0]; // the most recent messagem.messages[0].member; // the senderm.messages[0].content; // the contentm.messages[0].meta; // the metadata (if any)m.cursor.next; // if not null, there are more messages.// Get the next page using the cursorconst next = await chatClient.getMessages({ channel: chan1, cursor: { after: m.cursor.after, },});---### off---### on---### once---### publish▸ **publish**(params): PromisePublish a message into the specified channel.#### Parameters| Name | Type | Description || :--------------- | :---------------------- | :------------------------------------------------------------------------------------------ || params | Object | - || params.channel | string | Channel in which to send the message. || params.content | any | The message to send. This can be any JSON-serializable object or value. || params.meta? | Record | Metadata associated with the message. There are no requirements on the content of metadata. |#### ReturnsPromise#### ExamplesPublishing a message as a string:jsawait chatClient.publish({ channel: my-channel, content: Hello, world.,});Publishing a message as an object:jsawait chatClient.publish({ channel: my-channel, content: { field_one: value_one, field_two: value_two, },});---### removeAllListeners---### setMemberState▸ **setMemberState**(params): PromiseSets a state object for a member, for the specified channels. The previous state object will be completely replaced.#### Parameters| Name | Type | Description || :---------------- | :---------------------- | :--------------------------------------------------------------------------- || params | Object | - || params.channels | string \| string[] | Channels for which to set the state. || params.memberId | string | Id of the member to affect. If not provided, defaults to the current member. || params.state | Record | The state to set. There are no requirements on the content of the state. |#### ReturnsPromise#### Examplejsawait chatClient.setMemberState({ channels: [chan1, chan2], state: { online: true, typing: false, },});---### subscribe▸ **subscribe**(channels): PromiseList of channels for which you want to receive messages. You can only subscribe to those channels for which your token has read permission.Note that the subscribe function is idempotent, and calling it again with a different set of channels _will not_ unsubscribe you from the old ones. To unsubscribe, use [unsubscribe](#unsubscribe).#### Parameters| Name | Type | Description || :--------- | :--------------------- | :----------------------------------------------------------------------------------------------------- || channels | string \| string[] | The channels to subscribe to, either in the form of a string (for one channel) or an array of strings. |#### ReturnsPromise#### Examplejsconst chatClient = new Chat.Client({ token: ,});chatClient.on(message, (m) => console.log(m));await chatClient.subscribe(my-channel);await chatClient.subscribe([chan-2, chan-3]);---### unsubscribe▸ **unsubscribe**(channels): PromiseList of channels from which you want to unsubscribe.#### Parameters| Name | Type | Description || :--------- | :--------------------- | :--------------------------------------------------------------------------------------------------------- || channels | string \| string[] | The channels to unsubscribe from, either in the form of a string (for one channel) or an array of strings. |#### ReturnsPromise#### Examplejsawait chatClient.unsubscribe(my-channel);await chatClient.unsubscribe([chan-2, chan-3]);---### updateToken▸ **updateToken**(token): PromiseReplaces the token used by the client with a new one. You can use this method to replace the token when, for example, it is expiring, in order to keep the session alive.The new token can contain different channels from the previous one. In that case, you will need to subscribe to the new channels if you want to receive messages for those. Channels that were in the previous token but are not in the new one will get unsubscribed automatically.#### Parameters| Name | Type | Description || :------ | :------- | :------------- || token | string | The new token. |#### ReturnsPromise#### Examplejsconst chatClient = new Chat.Client({ token: })chatClient.on(session.expiring, async () => { const newToken = await fetchNewToken(..) await chatClient.updateToken(newToken)})## Events### member.joined• **member.joined**(member)A new member joined the chat.#### Parameters| Name | Type || :------- | :----------------------------------- || member | [ChatMember](./chat-chatmember.md) |---### member.left• **member.left**(member)A member left the chat.#### Parameters| Name | Type || :------- | :----------------------------------- || member | [ChatMember](./chat-chatmember.md) |---### member.updated• **member.updated**(member)A member updated its state.#### Parameters| Name | Type || :------- | :----------------------------------- || member | [ChatMember](./chat-chatmember.md) |---### message• **message**(message)A new message has been received.#### Parameters| Name | Type || :-------- | :------------------------------------- || message | [ChatMessage](./chat-chatmessage.md) |---### session.expiring• **session.expiring**()The session is going to expire. Use the updateToken method to refresh your token.
