Quickstart: Create an add-on in any coding language

Follow the steps below to create a simple Google Workspace Add-on in Google Cloud Functions without using Apps Script.

Before you begin

This quickstart requires:

  • A cloud project with billing enabled.
  • The Cloud SDK logged in and configured with the project.
  • Terminal open and in an empty directory

Step 1: Create a Google Cloud Function

  1. Enable Cloud Functions, Cloud Build, and the Add-ons API:

    gcloud services enable cloudfunctions cloudbuild.googleapis.com gsuiteaddons.googleapis.com
    
  2. Create the file functions.js containing the source below:

    /**
     * Google Cloud Function that loads the homepage for a
     * Google Workspace Add-on.
     *
     * @param {Object} req Request sent from Google
     * @param {Object} res Response to send back
     */
    exports.loadHomePage = function addonsHomePage (req, res) {
      res.send(createAction());
    };
    
    /** Creates a card with two widgets. */
    function createAction() {
      return {
        "action": {
          "navigations": [
            {
              "pushCard": {
                "header": {
                  "title": "Cats!"
                },
                "sections": [
                  {
                    "widgets": [
                      {
                        "textParagraph": {
                          "text": "Your random cat:"
                        }
                      },
                      {
                        "image": {
                          "imageUrl": "https://cataas.com/cat"
                         }
                      }
                    ]
                  }
                ]
              }
            }
          ]
        }
      };
    }
    
  3. Deploy the function:

    gcloud functions deploy loadHomePage --runtime nodejs10 --trigger-http
    
  4. Verify the function is deployed:

    gcloud functions call loadHomePage
    

Step 2: Authorize Google to invoke the add-on

  1. Find the service account email for the add-on:

    gcloud workspace-add-ons get-authorization
    
  2. Grant the service account the cloudfunctions.invoker role:

    gcloud functions add-iam-policy-binding loadHomePage --role roles/cloudfunctions.invoker --member serviceAccount:SERVICE_ACCOUNT_EMAIL
    

Step 3: Create an add-on deployment

  1. Create the file deployment.json with the source below, using the URL of the deployed function:

    {
      "oauthScopes": ["https://www.googleapis.com/auth/gmail.addons.execute"],
      "addOns": {
        "common": {
          "name": "My HTTP Add-on",
          "logoUrl": "https://github.com/webdog/octicons-png/raw/master/black/beaker.png",
          "homepageTrigger": {
            "runFunction": "URL"
          }
        },
        "gmail": {},
        "drive": {},
        "calendar": {},
        "docs": {},
        "sheets": {},
        "slides": {}
      }
    }
    
  2. Create the deployment:

    gcloud workspace-add-ons deployments create quickstart --deployment-file=deployment.json
    

Step 4: Install the add-on

  1. Install the deployment in development mode:

    gcloud workspace-add-ons deployments install quickstart
    
  2. Open or reload gmail to view the add-on. In the toolbar on the right, look for a beaker icon.

  3. Click the icon to open the add-on.