Firebase - Best Practice For Server Firestore Reads For Server-Side Rendering

Question

I have a server-side-rendered reactjs app using firebase firestore.

I have an area of my site that server-side-renders content that needs to be retrieved from firestore.

Currently, I am using firestore rules to allow anyone to read data from these particular docs

What worries me is that some bad person could setup a script to just continuously hit my database with reads and rack up my bills (since we are charged on a per-read basis, it seems that it's never wise to allow anyone to perform reads.)

Current Rule

// Allow anonymous users to read feeds
match /landingPageFeeds/{pageId}/feeds/newsFeed {
  allow read: if true;
}

Best Way Forward?

How do I allow my server-side script to read from firestore, but not allow anyone else to do so?

Keep in mind, this is an initial action that runs server-side before hydrating the client-side with the pre-loaded state. This function / action is also shared with client-side for page-to-page navigation.

I considered anonymous login - which worked, however, this generated a new anonymous user with every page load - and Firebase does throttle new email/password and anonymous user accounts. It did not seem practical.

Answer 1

Solution

Per Doug's comment, I thought about the admin SDK more. I ended up creating a separate API in firebase functions for anonymous requests requiring secure firestore reads that can be cached.

Goals

1. Continue to deny public reads of my firestore database
2. Allow anonymous users to trigger firestore reads for server-side-rendered reactjs pages that require data from Firestore database (like first-time visitors, search engines).
3. Prevent "read spam" where a third party could hit my database with millions of reads to drive up my cloud costs by using server-side CDN cache for the responses. (by invoking unnessary reads in a loop, I once racked up a huge bill on accident - I want to make sure strangers can't do this maliciously)

Admin SDK & Firebase Function Caching

The admin SDK allows me to securely read from firestore. My firestore security rules can deny access to non-authenticated users.

Firebase functions that are handling GET requests support server caching the response. This means that subsequent hits from identical queries will not re-run all of my functions (firebase reads, other function invocations) - it will just instantly respond with the same data again.

Process

1. Anonymous client visits a server-side rendered reactjs page
2. Initial load rendering on server triggers a firebase function (https trigger)
3. Firebase function uses Admin SDK to read from secured firestore database
4. Function caches the response for 3 hours res.set('Cache-Control', 'public, max-age=600, s-maxage=10800');
5. Subsequent requests from any client anywhere for the next 3 hours are served from the cache - avoiding unnecessary reads or additional computation / resource usage

Note - caching does not work on local - must deploy to firebase to test caching effect.

Example Function

const functions = require("firebase-functions");
const cors = require('cors')({origin: true});
const { sendResponse } = require("./includes/sendResponse");
const { getFirestoreDataWithAdminSDK } = require("./includes/getFirestoreDataWithAdminSDK");


const cachedApi = functions.https.onRequest((req, res) => {
    cors(req, res, async () => {
        // Set a cache for the response to limit the impact of identical request on expensive resources
        res.set('Cache-Control', 'public, max-age=600, s-maxage=10800');

        // If POST - response with bad request code - POST requests are not cached
        if(req.method === "POST") {
            return sendResponse(res, 400);
        } else {

            // Get GET request action from query
            let action = (req.query.action) ? req.query.action : null;
            console.log("Action: ", action);

            try {
                // Handle Actions Appropriately
                switch(true) {
                    
                    // Get Feed Data
                    case(action === "feed"): {
                        console.log("Getting feed...");

                        // Get feed id
                        let feedId = (req.query.feedId) ? req.query.feedId : null;

                        // Get feed data
                        let feedData = await getFirestoreDataWithAdminSDK(feedId);

                        return sendResponse(res, 200, feedData);
                    }

                    // No valid action specified
                    default: {
                        return sendResponse(res, 400);
                    }
                }
            } catch(err) {
                console.log("Cached API Error: ", err);
                return sendResponse(res, 500);
            }
        }
    });
});

module.exports = {
    cachedApi
}