Working with Google APIs

This guide describes how to create a custom web application using APIs available in the Google Cloud Platform API library.

The following tasks are discussed:

• Creating a project in the Google developer console

• Connecting multiple APIs to a single project

• Configuring the OAuth 2.0 credentials consent screen

• Connecting the completed app to a website

For the purposes of this guide, we’ll create an app that pulls user profile and activity data from a website and shares it with Google Analytics, but the steps outlined below are essentially the same for most web apps created in the Google Cloud Platform.

We will not discuss configuring Google Analytics in this guide, but users can find thorough guidance on configuring GA here: Google Analytics Configuration.

Create a new project

Begin by signing into the Google Developer Console. If this is your first time accessing the console, agree to the Terms of Service to proceed.

Depending on a number of variables that are irrelevant to our purpose, your Developers Console dashboard may look slightly different than the one shown in the image below. Not to worry, simply locate and select the APIs & Services link.

Select Create Project. If the project already exists, click the relevant project card to proceed.

Important

When a new API project is created, Google automatically creates links between the project and multiple Google services. For this reason, some fields cannot be modified once the project is created. If you make a mistake, you may not be able to correct the error later without creating an entirely new project. Therefore, verify your entries before selecting Create.

Give the project a name and use the dropdown menus to identify the organization and location (a website URL) that you want to associate with it, then click Create.

Connecting and Enabling APIs

You can now begin adding APIs to your project. Click Enable APIs and Services to proceed.

The APIs involved in this project are described below.

• The Google Analytics API allows users with established credentials to configure the data collection and the reporting profile for a specific property (domain/site/network).

• The People API collects user profile and contact information for consenting users and shares that data with Google Analytics. This API can be enabled with a couple of clicks. No configuration is necessary.

• The Google Analytics Reporting API allows authorized users to build custom dashboards in Google Analytics, automate complex reporting tasks, and integrate GA into a website. Like The People API, the Reporting API requires no configuration and is enabled with a few clicks.

Click Enable APIs and Services to proceed.

Enable the Google Analytics API

Use the search tool or scroll down to locate the Google Analytics API and select it.

Click Enable.

The app’s credentials do not need to be created until all APIs are connected, so you can ignore the Create Credential prompt for the time being. If your project requires only one API, click Create Credentials and scroll down to the Credentials section below.

Enable Google People API

Return to the API Library by selecting the Library option in the menu on the left.

Type “people” into the search tool to locate the Google People API and select it. On the subsequent screen, click Enable to add it to the project just as you did for the Google Analytics API.

Enable Google Analytics Reporting API

Finally, add the Google Analytics Reporting API in the same way as the other two. Return the API library, select the API and click Enable.

Once all the APIs have been added to the project, it’s time to configure the user consent screen.

Credentials

Google requires informed user consent for all of its data collection APIs. If the collected data is being shared with a third-party, Google requires organizations to verify that the data is being collected in accordance with Google API User Data Policies. The following sections explain how to submit the information required to obtain the OAuth 2.0 credentials for apps that collect and share user data.

Understanding OAuth Credentials

OAuth 2.0 is a protocol intended to ensure that users whose data is shared using Google services have consented to that transaction. See Understanding OAuth2 for a thorough explanation of how the protocol protects your data and why it is required.

From your project dashboard, click either the OAuth Consent Screen tab in the menu on the left or Create Credentials, if that option is displayed. Either option will take you where you need to go next.

Consent Screen

Google verifies user consent by displaying a popup modal generally referred to as the OAuth Consent Screen to affected users to inform them of who is collecting information and what information is affected. Data from users who refuse consent will not be shared with Google. Below is an annotated sample of an OAuth consent screen.

1. Logo – You organization logo or a logo unique to app appears here, if you choose to upload one.

2. App name – The name you give your app will appear here.

3. Target user – Identifies the user from whom the app is requesting consent.

4. Scopes – The data you are requesting, called ‘scopes’, appears here.

5. Terms and policy – Links to your app’s privacy policy and terms of service appear here.

The next section describes how to provide Google with the information that is displayed on the consent screen.

Internal vs External

Internal apps access and use data collected from members of the organization that developed the app (such as employees using a company’s internal scheduling app via the company website). Internal apps can share data, but only with other internal apps. Internal apps do not require

External apps are apps that collect, access or process data from users outside your organization or that share data with any website, app or user not directly associated with your organization.

Based on the descriptions above, select appropriate user type, and then click the Create button.

The fields on the next screen control what information is displayed in the OAuth Consent Screen.

App information

• App name – Enter any name you like. This field is required.

• User support email – Use the address for the Google account associated with this account. This field is required.

• App logo – Use the uploader to add a logo that will appear on the app authorization screen. Adding a logo is optional.

App domain

Application home page – Enter the home page URL of the site from which this app will be collecting data. Include the http or https protocol.

Application privacy policy link – Enter the URL to the privacy policy page of the site from which this app will be collecting data. Include the http or https protocol.

Application terms of service link  – Enter the URL to the Terms of Service page of the site from which this app will be collecting data. Include the http or https protocol.

Then click +Add Domain and enter your site’s domain name in the Authorized Domains field. Finally, enter an email address to which Google should send any notifications regarding this app. Once all the above have been added, click Save & Continue. 

Congratulations! For all intents and purposes, you’ve created a web app. Now, it’s time to convince Google to provide the credentials necessary for the app to be connected to working website.

Create Client ID

Use the following guidance to complete the Create OAuth Client ID form and click Create.

Click on the Credentials tab and, in the +Create Credentials dropdown, select OAuth client ID.

Application type – Select Web application and a series of settings relevant to web applications will appear.

Name – Here you are actually naming the credentials associated with this project. The name can be anything that works for you.

Authorized Javascript origins – All the javascript required for Beehive to function is contained in the app, so Admins can ignore this field.

Authorized redirect URIs – You must add the URI of the site being connected twice, once with a slash (/) at the end, and once without a slash (/) at the end.

You can quickly copy your URI redirects by navigating to the Accounts tab in Beehive. Under the Set up API Project section, you will notice a dropdown area for URI Redirects. Click on the row or the arrow to expand the section and you will be able to easily copy both of the URIs required for this step in the process.

When you are ready, click Create and Google will generate your credentials.

You can copy your Client ID and Client Secret key directly from this module or you can locate them at a later stage in your Credentials tab, as discussed below.

Locating Your Client Secret and Client ID

The Credentials screen contains a list of the Client IDs for all your Google API projects. Each Client ID will have an associated Client Secret, which can be viewed by clicking the name of the project or the pencil icon.

When you open the Client ID page, the Secret Key may not appear immediately. If not, simply refresh the page, and the key should appear beneath the Client ID.

The Client ID for this project cannot be changed, but users can reset the Client Secret as necessary by clicking Reset Secret.