How to upload documents to Google Drive using API and webhooks

Docdown can integrate with Google Drive using Outgoing Webhooks to save the generated documents automatically. This article helps you achieve the following:

1. Create a project in Google Developer’s console, enable Drive API and configure OAuth consent screen.
2. Get Client ID, Client Secret and exchange them for refresh token using OAuth Playground.
3. Configure Outgoing Webhooks in Docdown to authenticate and upload files to Google Drive.

Step 1: Register a new project in Google Developers console

Go to Google Developers Console. Select the dropdown from the top left (next to Google APIs logo) and click on New Project button. In this page (screenshot below), you can name your new project. For now let’s call it docdown-gdrive. Click on Create to continue.

In the following steps, when working inside the Google Developers console, please make sure that this project is always selected (from the dropdown on the top right).

Step 2: Register the project in the Firebase console

Now we need to register this project we just created in another service called Google Firebase. Go to the Firebase console, click on Create a project, and select docdown-gdrive project that we just created. To proceed, click continue.

In the next screen, simply click the Continue button.

Click continue to go to the next step.

In the next page, disable “Enable Google Analytics for this project” and click Add Firebase. After the project is ready, click Continue to return to the dashboard. We are now done with setting up this project in Firebase.

Step 3: Complete OAuth consent screen

Now go back to the Developers Console credentials page and make sure our project docdown-gdrive is selected in the top right dropdown. Click on Configure Consent Screen.

In the next screen, select the External radio button on User Type section and click the Create button.

Now in this screen (OAuth consent screen step), you need to fill in this information:

1. App name: Docdown (but can be anything you want)
2. User support email: Your email (should be present in the dropdown already)
3. Developer contact information: Your email again

Finally, click on “Save and continue”.

In the next screen (Scopes step), without changing anything, click on Save and continue. Similarly in the next page (Optional info step), click on Save and continue. Finally, click on “Back to dashboard” button.

In the “OAuth consent screen”, click on Publish App and confirm.

Now click on the Credentials menu option on the left sidebar. You should see a new entry under “OAuth 2.0 client IDs” called “Web client (auto-created by Google Service)” as shown below: Click on the pencil button on the row.

Now on this page, copy and make a note of the Client ID and Client secret. We will use these credentials in Docdown workflow setup. Now click on Add URI button under the section Authorized redirect URIs and add “https://developers.google.com/oauthplayground” in the textbox and Save.

Now to finish up our configuration, let’s enable Google Drive API on this project. To do that, search for “Google Drive API” in the top search bar. On the Google Drive API page (as in the screenshot below), click “Enable”. With this, we have completed one-time configuration of our Google Developers Console project.

Step 4: Get Access Token from OAuth Playground

Note: For this step, it can be helpful to watch the official Google tutorial, but please be aware it’s quite outdated and so UI might look very different.

Now we need to get the last piece of credential required to use the Drive API with the webhooks. Follow the steps below:

1. Go to Oauth2 playground: https://developers.google.com/oauthplayground/
2. In Settings (gear icon), set OAuth flow: Server-side, Access type: Offline and tick “Use your own OAuth credentials”. Add your Client Id and Client Secret from the previous step.
3. On the left sidebar, under the Step 1 section, scroll down and click on Drive API v3 and select the option “https://www.googleapis.com/auth/drive”. Your screen should look like below:

1. Click “Authorize APIs”. You will be prompted next to choose your Google account. Select your account, and confirm the access. If “unsafety” message comes up, click on “Advanced” and select the option to proceed.
2. Click Step 2 and then the button Exchange authorization code for tokens
3. Copy the returned Refresh token and make a note of it. Please note that these credentials need to be kept very safely as it can grant access to your Drive to anyone if leaked.

Now we have all the credentials needed from Google to access your Drive account. Please keep these credentials safely as these can grant dangerous permission to your account.

Step 5: Add outgoing webhook for authentication

Now in Docdown Workflow editor, after your Trigger step, create a new Outgoing Webhook step. This step will perform authentication with Google server using our credentials.

The configuration should have the following values:

1. URL: https://www.googleapis.com/oauth2/v4/token
2. Request Type: POST
3. Payload Type: Form
4. Wrap Request Data in Array: No

In the Data section, add these following 4 entries.

1. grant_type: refresh_token
2. client_id: client_id from the step 3
3. client_secret: client_secret from the step 3
4. refresh_token: refresh_token from step 4

Now click save. The settings should look like the following:

Step 6: Add outgoing webhook for uploading the file

Now add another Outgoing Webhook step. The configuration should have the following values:

1. URL: https://www.googleapis.com/upload/drive/v3/files?uploadType=media
2. Request Type: POST
3. Payload Type: Form
4. Wrap Request Data in Array: No
5. Data: No need to add anything.
6. File: Click on the “+” button and select generatedDocument (under STEP 1). It should appear as {{1.generatedDocument}} in the text field.

Headers:

1. Authorization: Bearer {{2.response.access_token}}
2. Content-Type: application/pdf

Note that if your previous outgoing step is not 3rd step, for example, the Authorization header should have the value Bearer {{3.response.access_token}} and so on. The settings should look like the following:

Final notes

1. Please keep your three credential tokens safely.
2. If you change the password of your Google account, you need to repeat step 4 to get a brand new refresh token.