Guides - Authentication with Firebase

This guide assumes that you already have installed Liveblocks into your project and that you’re already familiar with Firebase functions.

Install the Liveblocks package

To do that, let’s first install @liveblocks/node package in your Firebase functions project.

npm install @liveblocks/node

Setup authentication endpoint

Next, create a new Firebase callable function as shown below. This is where you will implement your security and define if the current user has access to a specific room.

const functions = require("firebase-functions");const { authorize } = require("@liveblocks/node");
exports.auth = functions.https.onCall((data, context) => { /** * Implement your own security here. * * It's your responsibility to ensure that the caller of this endpoint * is a valid user by validating the cookies or authentication headers * and that it has access to the requested room. */ return authorize({ room: data.room, secret: "sk_prod_xxxxxxxxxxxxxxxxxxxxxxxx", userId: "123", // Optional groupIds: ["456"], // Optional userInfo: { // Optional name: "Ada Lovelace", }, }).then((authResult) => { if (authResult.status !== 200) { throw new functions.https.HttpsError(authResult.status, authResult.body); } return JSON.parse(authResult.body); });});

Then, deploy your function with firebase deploy --only functions:auth.

Here is a diagram that shows how things work behind the scenes:

Auth diagram

Connect to Liveblocks

To connect to Liveblocks, you need to create a Liveblocks client with [createClient][] from the front-end and set the authEndpoint option based on the previously created “callable function”:

import { createClient } from "@liveblocks/client";import firebase from "firebase";import "firebase/functions";
firebase.initializeApp({ /* Firebase config */});
const auth = firebase.functions().httpsCallable("auth");
// Create a Liveblocks clientconst client = createClient({ authEndpoint: async (room) => (await auth({ room })).data,});

Liveblocks should now be integrated with your product!

© 2022 Liveblocks Inc.Edit this page