Real-Time Gaming Blog

Members Only! JavaScript Private Chat API w/ Access Control

4 min read Michael Carroll on Sep 2, 2014
Try PubNub Today

Free up to 1MM monthly messages. No credit card required.

Subscribe to our newsletter

By submitting this form, you are agreeing to our Terms and Conditions and Privacy Policy.

Good News! We've launched an all new Chat Resource Center. We recommend checking out our new Chat Resource Center, which includes overviews, tutorials, and design patterns for building and deploying m...

Waving Hand

Good News! We’ve launched an all new Chat Resource Center.

We recommend checking out our new Chat Resource Center, which includes overviews, tutorials, and design patterns for building and deploying mobile and web chat.

Take me to the Chat Resource Center →

We’ve now built out a pretty solid private chat application with chat alert popups and the ability to spawn an infinite amount of private channels for private chat. However, you might have noticed that our channels are pretty predictable. It’s not real private chat unless the rooms only allow appropriate members in.

In this tutorial, we’re going to change that, and we’ll add a layer of security to our private channels with permission-based authentication for private channels with our private chat API. To achieve this, we’ll be using PubNub Access Manager (PAM), which gives you access control over users, devices, channels, and keys. You’ll be able to restrict who gets access to read or write to specific channels.

We’ve now covered both building a multiplayer game lobby with a chatroom and the different ways we can use matchmaking to connect two different users. Here’s what we’ve covered so far:

This blog post is Part Ten of PubNub Developer Evangelist Ian Jennings‘s series on creating a multiplayer game with JavaScript.

Setting Up PAM with Our Private Chat API

In order to grant permissions to our users, we’ll first need a secret key. The demo and demo publish and subscribe keys don’t support access to PAM.

You’ll first need to sign up for a PubNub account. Once you sign up, you can get your unique PubNub keys in the PubNub Developer Portal.

Publish and Subscribe Keys

Enter your publish and subscribe keys from the PubNub console into the spots where demo and demo currently are.

private chat api

Secret Key

Not just anybody is allowed to grant permissions. To do that, you need asecret_key. You supply this in the same object as your publish and subscribe keys.

private chat api


Enabling PAM

When PAM is turned on, all channels are automatically set to have completely restricted read and write; meaning everything is locked down until you grant permissions out.

You can turn PAM on in the PubNub console. While you’re there, you should enable Presence too so our previous demos will continue to work.

private chat api



Now we know who is allowed to authorize other users, we need a way to identify who is allowed in what channel. For this we auth_keyauth_keygives us the ability to filter based on session, permissions levels, etc.

private chat apiWe’re going to plug in the same me.uuid variable into our setup object as auth_key.

Granting Permissions

Now we’re all set up to grant people access to channels. All we need to do now is call pubnub.grant().

Let’s break it down.

There is the channel: we want to grant access to. We usechannel + ',' + channel + '-pnpres', because using a comma lets us grant the same access to two channels at once.

The auth_key is the same as earlier. This is who we want to grant access to.

The properties read: true let us subscribe, and write: true let us publish.

The ttl: setting is a time for the grant to expire and it is set to 0 so it lasts forever.

There is also callback but if you don’t know what thats for by now you should go back to tutorial #1!

Grant Before Subscribe

We’re going to wrap our pubnub.subscribe call in a grant call so we have sufficient permissions before we try to connect.

Because we’re using PubNub presence, we also need to grant ourselves access to the channel + '-pnpres' channel.

We’ll grant ourselves permissions in channel, wait for the callback, grant ourselves permission in chanel + '-pnpres', wait for the callback, and then finally subscribe.

Now when we run the code, we should connect without errors. This will grant everybody access to the channel and presence channel when they load the page.

If you experience errors, check your auth_keychannel_name, and make sure PAM is enabled.

Make Private Channels Private

Now we’re going to do the same exact thing for the private user to user channel. When a user opens the modal, they’ll give themselves access to the private chat channel. No other users will have access to that channel besides the two users who start chatting.

Full Private Chat API Demo

See the Pen Memewarz – Private Chat #3 by Ian Jennings (@ianjennings) on CodePen.0

Real Security

private chat api

How could this possibly be secure if everyone can grant access to themselves? It isn’t. In the next tutorial, we’ll move the PAM permissions “server side” in a simulated NodeJS environment. We’ll actually be using another client CodePen client.

Get Started
Sign up for free and use PubNub to power real-time private chat

More from PubNub

How to Add a Notification Badge to Icons in React Native
Real-time Chat BlogDec 19, 20226 min read

How to Add a Notification Badge to Icons in React Native

Display real-time notification badges with PubNub and React Native to display important information and bring users back to your...

Michael Carroll

Michael Carroll

Digital Twins and the Future of Real-Time Data
InsightsDec 6, 20224 min read

Digital Twins and the Future of Real-Time Data

The concept of Digital Twins has evolved over the last two decades, however, one thing remains the same: the need for real-time...

Michael Carroll

Michael Carroll

In-Game Chat Fuels Player Engagement and Boosts Retention
Real-Time Gaming BlogNov 23, 20227 min read

In-Game Chat Fuels Player Engagement and Boosts Retention

Social features, like in-game chat, offer a solution to driving player retention by fueling engagement, attracting...

Michael Carroll

Michael Carroll