Click here to Skip to main content
65,938 articles
CodeProject is changing. Read more.
Articles / Languages / Javascript

Playing with Google Drive SDK and JavaScript

4.33/5 (2 votes)
20 Feb 2013CPOL2 min read 14.5K  
This posts gives a brief introduction to Google Drive JavaScript SDK and shows how to implement basic actions as downloading documents, creating directories and search for files or directories.

I am just starting to use the Google Drive SDK for one of my personal projects. The front-end of the application is written entirely in JavaScript. I am in the process of integrating Google Drive and it took me some time to get through the API reference and get it to work. Here are some useful code snippets. I have started with the JavaScript Quickstart available at the Google SDK page and I have added couple useful methods:

The Google Drive API is a standard RESTful API. You can access the functionalities only by issuing HTTP requests, so you do not need any special SDK. However the requests have to be signed. OAuth protocol is used to secure the communication. Google provides a SDK for many languages, JavaScript being one of them. Using this SDK facilitates the creation of HTTP requests. The API provides a good compromise between the simplicity and flexibility.

The OAuth Handshake

Every request has to be signed using OAuth token. The application has to first perform the OAuth handshake to obtain the token. JavaScript SDK provides gapi.auth.authorize function which can be used. This function takes the necessary  parameters (OAuth client ID and the scope) and also the callback which will be executed when the handshake is over.

JavaScript
function checkAuth() {
 gapi.auth.authorize(
  {'client_id': CLIENT_ID, 'scope': SCOPES, 'immediate': true},
  handleAuthResult);
}

function handleAuthResult(authResult) {
 if (authResult && !authResult.error) {
  //Auth OK
 }
}

Once the client is authenticated, the SDK stores the token internally and adds it to any new request, created before the web page is closed.

Composing the Google Drive Requests

Any simple request can be created with gapi.client.request function. The SDK will create an HTTP request using the supplied information. The method takes in JavaScript object. I have found that I am using mostly 4 fields in this object:

  • path – The url of the request
  • method – HTTP method of the request (get/post/put/delete)
  • params – Any information passed here will be added to the request as URL parameter
  • headers – Any information passed here will be added to the header of the HTTP request
  • body – The body of the request. Usually posted JSON

Getting First 10 Items from the Drive

JavaScript
function getItems() {
 var request = gapi.client.request({
  'path': 'drive/v2/files',
  'method': 'GET',
  'params': {
   'maxResults': '10'
  }
 });
 request.execute(listItems);
}

function listItems(resp) {
 var result = resp.items;
 var i = 0;
 for (i = 0; i < result.length; i++) {
  console.log(result[i].title);
 }
}

Creating a Folder

JavaScript
function createFolder(folderName) {
 var request = gapi.client.request({
  'path': 'drive/v2/files',
  'method': 'POST',
  'body': {
   'title': folderName,
   'mimeType': 'application/vnd.google-apps.folder'
  }
 });
 request.execute(printout);
}

function printout(result) {
 console.log(result);
}

In this request, nothing is passed as parameter in the URL. Instead of that JSON object containing two fields (title and mimeType) is passed in the body of the request. 

Searching for Folders

JavaScript
function getAllFolders(folderName) {
 var request = gapi.client.request({
  'path': 'drive/v2/files',
  'method': 'GET',
  'params': {
   'maxResults': '20',
   'q':"mimeType = 'application/vnd.google-apps.folder' and title contains '" + folderName + "'"
  }
 });

 request.execute(listItems);
}

You can get more information about searching the Google drive here.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)