Setup OAuth for Google Gmail

Set up OAuth for Google Gmail and integrate it with Filestack for smooth file uploads. Step-by-step tutorial provided for easy configuration.

Overview

If you would like your users to upload files from their Gmail accounts, you will need the Google Gmail OAuth application created. This tutorial will walk you through the entire process, step by step, showing how the Google project should be configured and integrated with Filestack.

Due to Google's requirement that you can only use domains that you own with Gmail OAuth application, this integration requires the use of the CNAME functionality. Please reach out to our Support Team to set it up.

Later in this tutorial we will use CNAME domain www.fs.myapp.com which is only an example. In a real application, please use the domain delegated during CNAME configuration process.

Create Project

Go to Google API Console and choose Create New Project.

Screenshot showing Register your application step in Google API Console

Once the project is created, click on "Go To Credentials".

Screenshot showing The API is enabled step in Google API Console

On the credentials screen select Google Gmail API, Web Browser (Javascript), and User Data. Then go to the next step - What Credentials do I need?

Screenshot showing The API is enabled step in Google API Console

Google will ask you to set up a consent screen for your application first. This is the page your users will see when they connect to your Google Gmail Application.

Screenshot showing Credentials step in Google API Console

Design your consent screen:

  • Give your application a name.
  • Set application type to Public.
  • Add logo.
  • Provide support email address. It will be visible to your users on the consent screen.

Screenshot showing first part of the consent screen.

Request scope ../auth/gmail.readonly.

Screenshot showing adding scope to the consent screen.

Configure domains:

  • Add Application Homepage link.
  • Add Application Privacy Policy link.
  • Optionally add Terms of Service link.

Screenshot showing domain configuration fot the consent screen

Click Save. It will bring you back to the Credentials screen.

Configure credentials

Choose OAuth client ID type.

Screenshot showing credentials creation screen.

Configure Credentials - set origins and redirect URIs.

  • Give your application a name.
  • Set https://www.fs.myapp.com/api/client/gmail/authCallback/open as Authorized redirect URI. Remember to change www.fs.myapp.com with your CNAME domain.

Screenshot showing credentials creation screen.

Once you provided all the details, you will be presented with OAuth client ID and client secret (keep it secret, keep it safe!).

Screenshot showing OAuth credentials.

Go back to your OAuth Consent Screen and submit for verification.

Verify application

Google pays attention to data privacy and users protection. Scope that we are asking for, gmail.readonly, is restricted and therefore Google requires any application that uses it to go through the verification process where dedicated team will assess your use case and either approve your application or not.

Google might also ask you to run 3rd party security assessment (through selected partners) of your application.

You can read more about the verification process here:

In order to start the verification process, click Submit for verification button at the bottom of your consent screen.

Screenshot showing OAuth consent screen ready for approval.

Google will ask you to justify the usage of the requested scopes. You have to explain how your users will access their Google Gmail resources (through Filestack) and what is your application logic once the email attachment was selected and uploaded.

Screenshot showing OAuth consent screen ready for approval.

Google might ask you to record a video of how your application is used in your environment. To do that, you will need to set your application to Inernal, configure Filestack in the next step, and use it with Google Account in your organization to grant access to the scopes requested by this app.

Screenshot showing OAuth consent screen ready for approval.

Developer Portal

Once that is done, go back to the Developer Portal Gmail Auth configuration and provide your client ID and client secret.

Screenshot showing OAuth consent screen ready for approval.

Enable Gmail, click Save and you are ready to go.

Screenshot showing OAuth consent screen ready for approval.

Once you’ve submitted your form, it may take Google 3-5 days to respond. Until then, you can still use your application with up to 100 users.