This is so that it only appears once the user has authenticated. The compose button is not displayed on the interface by default. This button will be positioned in the top right-hand corner of the interface (the pull-right Boostrap class helps with the positioning in this instance). Now we’ve got the required permissions we can go ahead with the first step - tweaking the UI to add a compose button. Once it’s been authorized, we should see something like this:
If things have gone according to plan, the application should ask us for authorization. Navigate to (or wherever you have placed your index.html file). Strangely there is a similarly named scope ( compose) which allows much greater access than we require. These two scopes are all we need for this application. Modify the scopes variable definition in the index.html as follows (note that the scopes variable is a space-separated string): var scopes = ' ' + '' Īs mentioned in the previous article, it’s always best practice to request the bare minimum permissions when working with someone else’s data - especially something as sensitive as their email account. However, sending an email requires further permissions. Previously we required read-only access to the users’ Gmail account. Enter Our CredentialsĪnd we should enter our credentials in index.html: var clientId = '' var apiKey = 'xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx' Tweak the Authentication Scopesįinally, we should tweak the authentication scopes.
git clone folder 01 - Basic client contains the code from the previous article. Now that the API credentials are set up we should check out the source code of the existing demo application. Keep this info open in a browser tab for the next step. Once we’ve filled in the necessary fields we should be able to see our credentials back in the Credentials section. Clicking Create will generate a client ID and client secret. We do not need to enter an authorized redirect URI. For a local development environment this will likely be or similar. Select Web application as the application type and enter at least one authorized JavaScript origin.
Click Create and Google will generate an API key.įor the OAuth client ID, click once more on New credentials and select OAuth client ID. However, for production I’d recommend adding a HTTP referrer (this will prevent abuse of our API key from non-authorized domains). On the following page we need only fill in the name field. Now we need to create two sets of credentials: a browser API key and an OAuth client ID.įor the browser API key select API key then Browser key.
From here we need to pop out the hamburger navigation menu and choose API Manager, then in the sidebar on the left we need to choose Credentials, before clicking on the New credentials button on the following page. Clicking Create will take us to the new project dashboard interface.
Navigate to the Google Developer Console and create a project.
Since we last looked at the Gmail API, Google have changed the user interface for the API management console - so here’s a quick update on how to create the necessary Gmail API credentials. This will allow us to create applications which utilise Gmail functionality. The first step is to set up the Gmail API on your Google account. Enabling the Gmail API on Your Google Account