Most Powerful Open Source ERP

Howto integrate Googledrive

  • Last Update:2020-05-20
  • Version:001
  • Language:en

Google Drive Integration to jIO

The integration has been executed with the Google Drive REST Api ,which documentation is available here: https://developers.google.com/drive/v2/reference/

this guide will explain you how to create a Google Drive storage in jIO.  

summary:

  • Google Drive credentials retreiving process overview.
  • creation of a Google Drive application
  • Getting the user token and creating a jIO Google Drive storage
  • details about the Google drive storage. 

Dropbox credentials retrieving process overview 

To access an user's Drive account, you have to create a Google Drive application the user will log into.

once connected, you will receive an access token that can be used with jIO.

creation of a Google Drive application

follow the step 1 of this tutorial at Google developers website: https://developers.google.com/drive/web/quickstart/js

at step 'e', when asked the authorized javascript origins, put the url your jIO application instead of the 'localhost' provided example.

Getting the user token and creating a jIO Google Drive storage

now that you have a google Drive application, put this code in your jIO application web page:

 
  <html>
  <head>
    <title> token generator </title>
    <script type="text/javascript">
      var CLIENT_ID = 'YOUR_CLIENT_ID';

      var SCOPES = ['https://www.googleapis.com/auth/drive',
               		'https://www.googleapis.com/auth/drive.file',
                    'https://www.googleapis.com/auth/drive.appdata'];
       

      //handles the response of Google server about authentification.
      function handleAuthResult(authResult) {
        if (authResult && !authResult.error) {
        var token = gapi.auth.getToken().access_token,
          storage = jIO.createJIO({type: "gdrive", access_token : token,});

        }
      }

      //event of "Authorize" button, asking for authentification to Google.
      //change the parameter "immediate" to "true", to try to automatically
      //retreive a token without user interaction. 
      //(if user kept a cookie on the page)
      
      function handleAuthClick(event) {
        gapi.auth.authorize(
          {client_id: CLIENT_ID, scope: SCOPES, immediate: false},
          handleAuthResult);
        return false;
      }
    </script>
    <script src="https://apis.google.com/js/client.js?onload=checkAuth">
    </script>
  </head>
  <body>
      click on the button to create a jIO Google Drive storage.
    <br>
      <button id="authorize-button" onclick="handleAuthClick(event)">
        Authorize
      </button>
    <pre id="output"></pre>
  </body>
</html>

this example is a basic web page with a button that, when hit, shows a pop-up asking the user to login to his Google account, and to accept your application to access his google drive and adding/modifying files on it.

Once the pop-up closed, the handleAuthResult function is called, and here checks if the user is identified, and if so, retrieves the user access token to create a new jIO storage

Do not forget to replace the 'YOUR_CLIENT_ID' field by the id you retreived at the end of the creation of your Google Drive application

details about the Google drive storage.

The jIO Google Drive storage is based on the documentStorage. every document corresponds to a Google Drive file. the files are identified by an unique ID. A get() on a file will give you his metadatas: his name, mimeType, parent(s) directory/ies and other informations.

Each document has an attachment, which is the content of the file.

in Google Drive, there is a directory structure, and if you remove a directory, you will remove all his child documents. A directory is a document with the mimeType "application/vnd.google-apps.folder".

by default, when doing a "remove", documents are sent to the trash, and can be recovered.

If you want to definitively remove your document, you can, at the creation of your jIO storage add the parameter "trashing" and set it to false (default to true).