• Blog
  • Documentation
  • Courses
  • Changelog
  • AI Starters
  • UI Kit
  • FAQ
  • Supamode
    New
  • Pricing

Launch your next SaaS in record time with Makerkit, a React SaaS Boilerplate for Next.js and Supabase.

Makerkit is a product of Makerkit Pte Ltd (registered in the Republic of Singapore)Company Registration No: 202407149CFor support or inquiries, please contact us

About
  • FAQ
  • Contact
  • Verify your Discord
  • Consultation
  • Open Source
  • Become an Affiliate
Product
  • Documentation
  • Blog
  • Changelog
  • UI Blocks
  • Figma UI Kit
  • AI SaaS Starters
License
  • Activate License
  • Upgrade License
  • Invite Member
Legal
  • Terms of License

Blocking authentication with Firebase Auth Functions

Jul 26, 2022

Firebase has introduced functions that allow us to write server logic before or after authenticating. Let's see how to use them.

firebase

Firebase Auth Functions are blocking functions that allow us to write server-side logic when the user creates an account or when signs in. This has been one of the most requested features, which is why we're so excited about it.

The two blocking functions are:

  1. beforeCreate: use this function before signing the user up to your Auth Database

  2. beforeSignIn: use this function when the user is verified upon signing in (i.e. when the sign-in process is successful). This function is also called when the user is signing up.

Firebase Authentication Blocking Functions: Use-Cases

These functions can be used for various use-cases, such as:

  • only allow users signing up with an allowed email or domain
  • prevent users from accessing using certain IP addresses
  • modifying user's data upon signing in (for example, set certain custom claims)
  • ... and many others!

Requirements: Update to Firebase Authentication with Identity Platform

To use this new functionality you have to upgrade your Firebase project to Firebase Authentication with Identity Platform using the Firebase Console.

Preventing users from creating an account with Firebase Auth

One common scenario is to prevent the user from signing up based on certain criteria, such as: email domain, IP address, and so on.

To do so, we can use the beforeCreate Firebase Auth function so that we can check if the details provided meet the criteria for signing up to your Firebase application.

In the example below, we have a list of allowed domain names, and we check if the user's email is among the list:

tsx
import functions from 'firebase-functions';
const ALLOWED_DOMAINS: string[] = [
'@yourapp.com'
];
export const beforeCreate = functions.auth.user()
.beforeCreate((user) => {
const canAccess = ALLOWED_DOMAINS.some(domain => {
return user.email.includes(domain);
});
if (!canAccess) {
throw new functions.auth.HttpsError(
'invalid-argument',
`Unauthorized email "${user.email}"`
);
}
});

Preventing users from signing in with Firebase Auth

We can also prevent user from signing in after they've created a profile. For example, let's assume an IP is acting suspiciously and we have banned it from the application:

tsx
export const beforeSignIn = functions.auth.user()
.beforeSignIn((user) => {
const ip = context.ipAddress;
if (isSuspiciousIpAddress(ip)) {
throw new functions.auth.HttpsError(
'permission-denied',
'Unauthorized access!'
);
}
});

Another common scenario can be blocking access to your application from mobile or unsupported devices:

tsx
export const beforeSignIn = functions.auth.user()
.beforeSignIn((user) => {
const userAgent = context.userAgent;
if (isMobile(userAgent)) {
throw new functions.auth.HttpsError(
'permission-denied',
'Unauthorized access!'
);
}
});

Deploy Firebase Auth Blocking Functions

Finally, remember to deploy your functions:

text
firebase deploy --only functions

To know more about Firebase's blocking functions and the detailed API, visit the Firebase documentation.

Some other posts you might like...
Dec 17, 2022How to reduce and boost your Firebase cold start timesFirebase cold start times are a common problem for developers. In this tutorial, we'll show you how to reduce and boost your Firebase cold start times.
Oct 21, 2022Counting a collection's documents with Firebase FirestoreIn this article, we learn how to count the number of documents in a Firestore collection using a custom React.js hook.
Oct 21, 2022Pagination with React.js and Firebase FirestoreIn this article, we learn how to paginate data fetched from Firebase Firestore with React.js
Oct 6, 2022Limiting the Firebase Storage space used by each customerLimiting the amount of Storage space used by your customers can be tricky. In this article, we show how to set a quota for each of your customers.
Oct 6, 2022Creating a Waitlist with Firebase AuthImplement a waitlist sign-up with Firebase Auth and allow sign-ins in batches to your SaaS
Sep 29, 2022Using Firestore in Firebase Storage RulesFirebase Storage now allows you to use Firestore queries to in your security rules. Here is all you need to know!