Browser Quickstart

Complete the steps described in the rest of this page, and in about five minutes you'll have a simple browser application that makes requests to the Google Tasks API.

Prerequisites

To run this quickstart, you'll need:

  • Python 2.4 or greater (to provide a web server).
  • A Google account with Google Tasks enabled.

Step 1: Turn on the Google Tasks API

  1. Use this wizard to create or select a project in the Google Developers Console and automatically turn on the API. Click Continue, then Go to credentials.
  2. On the Add credentials to your project page, click the Cancel button.
  3. At the top of the page, select the OAuth consent screen tab. Select an Email address, enter a Product name if not already set, and click the Save button.
  4. Select the Credentials tab, click the Create credentials button and select OAuth client ID.
  5. Select the application type Web application.
  6. In the Authorized JavaScript origins field, enter the URL http://localhost:8000. You can leave the Authorized redirect URIs field blank.
  7. Click the Create button.
  8. Take note of the client ID in the resulting dialog. You will need it in a later step.
  9. Click OK to dismiss the resulting dialog.
  10. Click the Create credentials button and select API key.
  11. Take note of the API key in the resulting dialog. You will need it in a later step.
  12. Click the Close button to create an unrestricted key. In production applications, you can restrict access to the API key to specific websites, IP addresses or mobile apps.

Step 2: Set up the sample

Create a file named quickstart.html and copy in the following code:

      /**
       * Print task lists.
       */
      function listTaskLists() {
        gapi.client.tasks.tasklists.list({
            'maxResults': 10
        }).then(function(response) {
          appendPre('Task Lists:');
          var taskLists = response.result.items;
          if (taskLists && taskLists.length > 0) {
            for (var i = 0; i < taskLists.length; i++) {
              var taskList = taskLists[i];
              appendPre(taskList.title + ' (' + taskList.id + ')');
            }
          } else {
            appendPre('No task lists found.');
          }
        });
      }

Replace the placeholder <YOUR_CLIENT_ID> in the copied code with the client ID you created in Step 1. Likewise, replace the placeholder <YOUR_API_KEY> with the API key you created.

Step 3: Run the sample

  1. Start the web server using the following command from your working directory:

Python 2.x

python -m SimpleHTTPServer 8000

Python 3.x

python -m http.server 8000

  1. Load the URL http://localhost:8000/quickstart.html into your browser.

The first time you run the sample, it will prompt you to authorize access:

  1. Click the Authorize button to open the authorization window.

    If you are not already logged into your Google account, you will be prompted to log in. If you are logged into multiple Google accounts, you will be asked to select one account to use for the authorization.

  2. Click the Accept button.

Notes

  • After the initial user authorization, calls to gapi.auth.authorize that use immediate:true mode will obtain an auth token without user interaction.

Further reading

Troubleshooting

Error: origin_mismatch

This error will occur during the authorization flow if the host and port used to serve the web page doesn't match an allowed JavaScript origin on your Google Developers Console project. Make sure you completed the Step 1.e and that the URL in your browser matches.