Signing in users from a Chrome extension

This document shows you how to use Identity Platform to sign in users from a Chrome extension.

Before you begin

  • Enable Identity Platform and configure an identity provider. See the Quickstart to learn how.

  • Add the following URLs to the content_security_policy allowlist for your extension:

    • https://apis.google.com
    • https://www.gstatic.com
    • https://www.googleapis.com
    • https://securetoken.googleapis.com

    See the Content Security Policy (CSP) documentation to learn more.

Registering your extension's ID

To sign users in from a Chrome extension, you need to register your extension's ID as an authorized domain:

  1. Go to the Identity Platform Settings page in the Cloud Console.

    Go to the Settings page

  2. Select the Security tab.

  3. Under Authorized Domains, click Add Domain.

  4. Enter your extension's URI. It should look something like chrome-extension://CHROME_EXTENSION_ID.

  5. Click Add.

Signing in users

Signing in users from a Chrome extension is similar to a web app, with a few differences:

  • Phone and multi-factor authentication are not supported.

  • Chrome extensions cannot use HTTP redirects, so you'll need to use pop-up operations (signInWithPopup() and linkWithPopup()) to sign in users.

  • Calling authentication methods from a browser action will cancel the browser action, so call them from a background script instead.

The following example demonstrates signing in a user with Google:

JavaScript

popup.js

// Get reference to background page.
const bgPage = chrome.extension.getBackgroundPage();
// Sign in with popup, typically attached to a button click.
bgPage.signInWithPopup();

background.js

const app = firebase.initializeApp(config);
const auth = app.auth();
const signInWithPopup = () => {
  const provider = new firebase.auth.GoogleAuthProvider();
  return auth.signInWithPopup(provider).catch((error) => {
    console.log(error);
  });
};

What's next