EngEd Community

Section’s Engineering Education (EngEd) Program fosters a community of university students in Computer Science related fields of study to research and share topics that are relevant to engineers in the modern technology landscape. You can find more information and program guidelines in the GitHub repository. If you're currently enrolled in a Computer Science related field of study and are interested in participating in the program, please complete this form .

How to Secure Apps with Firebase Security Rules

October 1, 2021

Firebase is among the most popular online databases. In this guide, we will learn how we can secure Firebase apps using various rules.

Firebase security rules determine who can read or write on the databases. We will dive deeper into how security rules work by building a simple project.

Table of contents

Prerequisites

To follow this tutorial, you will need some JavaScript knowledge. In addition, some back-end knowledge is also necessary as it will help you understand various Firebase concepts.

You also need a text editor like Visual Studio Code and Node.js installed on your machine.

What is Firebase?

Firebase is a Google back-end service that allows developers to build robust Android, web, and IOS applications.

Firebase provides developers with tools and services to help them create quality apps, speed up back-end development, track analytics, and engage users through cloud messaging.

Cloud Firestore is a NoSQL database system that stores data in JSON files. It is an excellent back-end service that helps you save significant time.

With Firebase, you can perform several sorts of authentication, manage the database, store media file, run analytics, and more.

Data is essential in all applications. Firebase has two database services: Real-time database and Cloud Firestore database.

In this tutorial, we will concentrate on the Cloud Firestore database.

Popular applications using Firebase include:

Why security is important in Cloud Firestore

Some applications require one to store data in the cloud for security reasons.

Cloud Firestore lets you store, sync data across multiple devices, and query your app data in the cloud. It comes with a set of security rules to help you control access and protect user’s data.

The security rules are stringent as only approved apps have read, write, and validate permissions.

Security is critical to your application. Therefore, you should ensure that you understand how to use Firebase rules, especially when dealing with sensitive data.

This is the best way to prevent data breaches, as well as identify vulnerabilities.

Securing your Firebase app with security rules

Security rules protect your data in both real-time databases and Cloud Firestore from unauthorized access.

We will demonstrate how this works by building a simple messaging app using Cloud Firestore.

Step 1: Create a new Firebase project

To begin, navigate to Firebase and sign in using your Google account.

Firebase

After a successful sign-in, navigate to Google Firebase console and click add project button to create a new project.

Name your project appropriately and follow the on-screen steps to finish up.

Step 2: Setup Cloud Firestore

In your Firebase console, select Cloud Firestore and you’ll be directed to the database section.

Then, click the create database button, to create a new database.

Add a collection named chat and a document named message into it, as shown below:

Create database

Step 3: Create a basic messaging app

Our project is simple. You only need to create a folder where the messaging app is placed. Then add index.html and script.js files.

We will also add Firebase to our app. There are two ways to add Firebase to web projects:

The first method involves using Node Package Manager (NPM) in your terminal:

npm install firebase

The second method to use a content delivery network (CDN) by adding it to your project:

<script src="https://www.gstatic.com/firebasejs/8.2.1/firebase-app.js"></script>

<script src="https://www.gstatic.com/firebasejs/8.2.1/firebase-database.js"></script>

The index.html file contains our HTML code and links to other files. To start the app, copy and paste the code below:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <title>Firebase Cloud Firestore</title>
    <link rel="stylesheet" href="">
  </head>
  <body>

    <!-- scripts -->
    <script src="https://www.gstatic.com/firebasejs/8.2.1/firebase-app.js"></script>
    <script src="https://www.gstatic.com/firebasejs/8.2.1/firebase-database.js"></script>
    <script src="script.js"></script>
    <header>
        <h2>Firebase ChatApp</h2>
      </header>
  
      <div id="chat">
        <!-- messages will display here -->
        <ul id="messages"></ul>
  
        <!-- form to send message -->
        <form id="message-form">
          <input id="message-input" type="text" />
          <button id="message-btn" type="submit">Send</button>
        </form>
      </div>
  </body>
</html>

Below is how the app looks like:

Chat App

Step 4: Firebase security rules

Read and write rule

To add this rule, navigate to the rules tab next to the data tab in the Firebase console.

You will see the Cloud Firestore policy configuration that looks like this:

Cloud Firestone Policy Configuration

To update the Cloud Firestore security policy, click Edit rules at the top-left corner to change the security rules.

Edit Rules

Syntax:

service cloud.firestore {
  match /databases/{database}/documents {
    match /<path>/ {
      allow read, write: if <condition>;
    }
  }
}

Add the following rule:

service cloud.firestore {
  match /databases/{database}/documents {
  match /chat/{anything=**} {
  allow read, write: if true;
  }
    match /{document=**} {
      allow read, write: if false;
    }
  }
}

This rule will allow all users to read and write data in the chat collection.

Authenticated required rule

If read/write permission needs to be given to authenticated users, you can use the request.auth condition.

To achieve this, check if the signed-in user’s id (uid) exists or not.

The Cloud Firestore Policy ends up looking like this:

service cloud.firestore {
  match /databases/{database}/documents {
  match /chat/{anything=**} {
  allow read, write: if true;
  }
    match /{document=**} {
      allow read, write: if request.auth.uid != null;
    }
  }
}

Secure logged-in user data

The logged-in user data should always be protected. With this security rule, users can only update their data if they are autheniticated successfully.

service cloud.firestore {
  match /databases/{database}/documents {
  match /users/userId {
      allow read, write: if request.auth.uid == userId
    }
  }
}

You could use a 2-factor authentication (2FA) for enhanced security. For instance, you can use an email for verification using auth.token.email_verified, as shown below:

service cloud.firestore {
  match /databases/{database}/documents {
  match /users/userId {
      allow read, write: if request.auth.uid == userId
      && request.auth.token.email_verified ==true
    }
  }
}

Conclusion

Securing your Firebase application is essential and easy. However, many developers do not secure the databases which making them vulnerable to attacks.

You can avoid such issues using the Firebase security rules discussed in this article.

Happy coding!


Peer Review Contributions by: Eric Gacoki