Securely deploy your Tensorflow JS model via Google App Script

Background Story

I recently wanted to share my new Tensorflow JS model with my colleagues at office to get their feedback. Rather than handing them a folder of HTML and JavaScript files, I wanted to deploy it as an internal static site for a better user experience. There are several hosting services to easily achieve this, but as my model is confidential it should only be accessible by company employees. I didn’t want to spin up an entire server side system to take care of authorization, but instead want to achieve this with minimal changes to my static HTML file. My company is subscribed to GSuite services (docs, sheets, drive etc.) which is what I chose to deploy the site securely. If you wish to publicly deploy your model via Firebase hosting, checkout this codelab by Jason Mayes.

Solution Overview

  1. Train & export your Tensorflow Keras model
  2. Convert the Python model to Javascript
  3. Load and serve the model from Google Drive via app-script using tfjs
  4. Deploy it as a secure website

1. Train a simple model

To follow along you can either create a tf keras model from scratch in seconds as shown in the notebook below or use your own. This is a dummy model which is trained to simply multiply the given input with 3. It is not useful in practice, but has all the ingredients to put the point across.

A toy Tensorflow Keras model that learns how to multiply a given input with 3

2. Python Model → JavaScript Model

Tensorflow JS team created a wonderful converter which walks us through the process of converting various types of Python models to be runnable in JavaScript. Install their tool and follow the steps mentioned here.

Options I chose on tensorflow_wizard to convert our 3 multiplier Python model to JavaScript

3. ️️Serve the model with Google App Script

We are finally at the crux of this post. Upload your converted tfjs model folder to Google Drive and set permissions appropriately. This is our first line of defense 👮‍♀️ in terms of security for our model. I set it as viewable to anyone in my company.

App script code to load our JS model from Drive for serving
JavaScript snippet that loads a tfjs model from Google Drive
  1. IndexedDB
  2. Local storage
  3. HTML File inputs
  4. Custom IO
const modelJson = new File([modelFiles[0]], "model.json", { type: "application/json" })
const modelWeights = new File([Uint8Array.from(modelFiles[1])], "group1-shard1of1.bin")

Some optional things to try

to improve the experience could be to

  • Use preact or similar to create a more modern component based app
  • Use clasp to manage your app-script code locally in your favorite editor and publish it to git. I published this code at https://github.com/Nithanaroy/tfjs-drive-deploy/tree/master in the same manner.

4. Deploy Securely 🚀🔒

This is the easiest step of all and one of the primary reasons for choosing app-script in the first place. Select “Deploy as web app” option from “Publish” menu on the app-script UI and choose the settings that suit your needs. In my my case, I enabled access to users from my company.

App script provides basic authorization for free
The final resultant model in action that runs inside browser and deployed with App Script and Google Drive

Applied Deep Learning Engineer | LinkedIn

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store