Setup and event listeners

All chat applications have a notion of a user. It's important to be able to uniquely identify users as they interact with the PubNub Network. Usually, a user is a human end usera person using an app to interact with a system (via a laptop, phone, tablet, or kiosk).

You use a UUID (referred to as userID in PubNub initialization) to uniquely identify each user on the system. Users can connect from multiple devices, such as phones, tablets, desktops, etc., using the same UUID. If a user is connected from multiple devices simultaneously, they will receive the same messages on each device.

Setup

Start by initializing a PubNub object with publishKey, subscribeKey, and userId as required fields. The userId is a string of maximum 64 characters that represents a user in your application.

Your publish and subscribe keys are available in your PubNub Account. Go to the Admin Portal to create your free account.

userId is required

Setting the userId parameter is required to establish a connection to PubNub, ensure that your billing is accurate, and for other features like presence and storage to work as expected.

const pubnub = new PubNub({
subscribeKey: "mySubscribeKey",
publishKey: "myPublishKey",
userId: "john-doe",
autoNetworkDetection: true, // enable for non-browser environment automatic reconnection
restore: true, // enable catchup on missed messages
});

Add event listeners

Events are received in your app using listeners. These listeners allows a single point to receive messages, signals, and presence events. Each event type has its own handler to receive them where you implement your custom app logic to perform actions on events.

The following handlers are available to you:

HandlerDescription
StatusReceives events when the client successfully connects (subscribes), or reconnects (in case of connection issues) to channels.
MessageReceives all messages published to all the channels subscribed by the client. The event payload will contain the published message data, publish timetoken, the UUID of the client that published the message and more.
SignalReceives all signals that are sent to any channels subscribed by the client. The event payload will contain the signal data, signal timetoken, the UUID of the client that published the message and more.
PresenceReceives all presence events that are triggered on any channels subscribed by the client. The event payload will contain the presence event type (join, leave, timeout, state-change), timetoken of the action, the UUID of the client that caused the event, state data (if applicable) and more.
MessageActionReceives all events when existing messages are annotated (by an action) for any channels subscribed by the client. The event payload will contain the UUID that acted on the message, message action type (such as an emoji reaction), timetoken of the annotated message, timetoken of the action, action value and more.
ObjectsReceives all objects events that are emitted when a channel, channel membership, or user metadata is created, updated or removed.
pubnub.addListener({
message: function(m) {
// handle message
var channelName = m.channel; // The channel to which the message was published
var channelGroup = m.subscription; // The channel group or wildcard subscription match (if exists)
var pubTT = m.timetoken; // Publish timetoken
var msg = m.message; // The Payload
var publisher = m.publisher; //The Publisher
},
presence: function(p) {
// handle presence
var action = p.action; // Can be join, leave, state-change, or timeout
var channelName = p.channel; // The channel to which the message was published
var occupancy = p.occupancy; // Number of users subscribed to the channel
var state = p.state; // User State
show all 67 lines