What we’re building

In my previous post I showed how to upload videos to Firebase Cloud Storage using client side encoding. This approach puts the encoding burden on the client, but can save server transcoding costs.

This time I’ll show how to use server side encoding instead, combining Firebase Cloud Storage, Firebase Cloud Functions and the Publitio API which I’ve written about previously.

System Design

The processing pipeline for each video file is as follows:

1. Uploading the file from the client to Firebase Cloud Storage.
2. Creating a document in Firestore, with “processing” status.
3. Cloud Function is triggered by document creation.
4. The Cloud Function generates a temporary signed url pointing to the file in Cloud Storage.
5. The Cloud Function invokes Publitio remote file upload endpoint, with the signed url. (You can switch this to any media encoding API)
6. The Cloud Function saves the Publitio video id, URL, thumbnail url, and other metadata in Firestore, and changes the document “processing” status to finished.
7. The updated Firestore document is updated on the client instantly.

Why not upload directly from the client to publitio?

Firebase Cloud Storage provides a more robust way to upload in serverless architectures. We can use firebase authentication to allow only signed in users to upload, prevent users from deleting other people’s videos etc. If we upload directly from the client to publitio, we’ll have to put the API key and secret on the client. That’s a security concern, because we have to assume that anything on the client can be obtained by a malicious actor.

Why not just encode in the Cloud Function?

The main reason this is problematic is the hard limit Firebase sets on function execution time: 9 minutes (source). If you want to achieve good compression, you’ll need to run a slow encoding process which will probably take more than 9 minutes.

Another reason is that you’ll be rewriting video encoding logic that’s already available in specialized APIs.

The Client

The client is the simplest part here. I’ve used basically the same Flutter client from the previous post, without the client side encoding, for simplicity.

I’m assuming you already have a firebase project set up. If not, you can take a look at the previous post

#videos #cloud-storage #firebase #flutter #serverless