🟦 [FREE] GD Connector - connect users to their own Google Drive and Google Sheets

iconGDC96

GD Connector

This extension works with a Google Apps Script Web App to connect a user with their own Google Drive and Google Sheets. You need both entities for everything to function correctly. The extension works by using a webviewer to maintain the google sign in and authentication of the AI2 app, and all calls and responses go through the webviewer. It is in this way that the user can connect to their own google drive. There are @ 20 Drive functions and @ 20 Sheet functions available. Included in the extension are blocks to handle base64 conversion and JSON array conversion.

  • Latest Version: 1.0
  • Tested: This has been tested on App Inventor 2 using Android 10 and 12 devices, companion 2.62, and compiled apk. Also tested with a verified and unverified web app. It may work on other derivatives....e.g. Kodular/Niotron/etc.
  • Released: 4 March 2022
  • Last Updated: 4 March 2022
  • Built: Using the Rush Extension Builder by @Shreyash
Instructions

Google Apps Script Web App

  1. In your google drive, create a new Apps Script project, you can name it as you wish.

  2. Paste the contents of Code.js into Code.gs, overwriting any thing that is there.

  3. Create a new script file in the project called Functions.gs.

  4. Paste the contents of Functions.js into Functions.gs, overwriting any thing that is there.

  5. Save both .gs files.

  6. Publish your apps script as a web app, with, using the Legacy editor:
    gaswpsetup1
    or using the new editor:
    gaswpsetup2

  7. Get the script url, and keep it safe.

Extension

I will advise you to try out the demo aia project first, because that will hopefully show you how everything fits together. Once a few variables are filled in with IDs or links, all the functions can be used, and everything is returned via notifiers and saved to tinyDB. The demo AIA also contains some helper variables that show the data structures required for some of the functions.

There is also a barebones starter aia project, with only the things you need to get up and running. These are the blocks required for basic setup:

  1. The extension will require the web app script url, so ensure you have a variable for that, and that you set this using the property block for the script url on initialise.
  2. Screen1.initialise will also need the following blocks to setup the webviewer correctly.
  3. You also need to setup the WebViewString Changed block, to handle all the returns from the script to the webviewer, and to deal with authentication.
  4. On first run of the aia project, you will need to authenticate with the web app. You may first be asked to sign in to your preferred google account. Once signed in, the webviewer remembers you from then on. You will then need to authenticate with the web app, and give it permission to access your google drive. Only the web app can access "your" google drive, I can't, the developer can't, only you, the user, when authenticated through the app. As the developer you will not have had the chance to get your web app verified, this will present a couple of extra "ugly" screens about the web app being unverified (you will be used to this if you have created web apps or functions with apps script). Once authenticated, the webviewer will display this page:

GDCAuthPage

and the user can press on the Close button and use your app.

...

Blocks - there are a lot of blocks ;)

Methods

Properties
gdcProperties1

Events

...

Usage - may be easier to view by loading the demo aia

Methods

gdcUsageMethods11

Events

gdcUsageEvents7

Demo Images

GDCDemoMainMenu

Credits
My thanks to Luke Gackle, Sunny Gupta and Juan Antonio for their snippets of source code that helped me put this together, and thanks to Juan Antonio and Preet Vadaliya for their support and encouragement.

Downloads

You will need to setup your own web app for the AIA projects to work

Demo AIA:
GDConnectorDemoV2.aia (60.0 KB)

Barebones AIA
GDConnectorV2BareBones.aia (42.8 KB)

Code.js (6.8 KB)

Functions.js (23.2 KB)

Extension
uk.co.metricrat.gdconnectorV1.aix (34.5 KB)

Useful Links
How to apps script project and versions links

GD Connector Site

Finally....
Enjoy :smiley: , and all feedback and comments welcome.

Available for use in any MIT AppInventor projects or competitions

10 Likes

Wonderful. So many blocks and demo aia.

One question : is the webviewer has to visible? If not, then why not create it dynamicly in the source code?

Thank you :+1:

The webviewer doesn't have to be visible for this to work, it is made visible in the demo for the completion of the authentication process, and then checking of continued authentication. Once authentication is completed, the webviewer can be made non-visible.

If only I knew how :wink:

To be honest, with so much else going on in GD Connector, it didn't cross my mind :slight_smile:

Would need to test to ensure that the sign in and authentication cookies did not get lost on app restarts, otherwise users would have, as a minimum, to keep signing in to their google account.

[EDIT] Went off to try it, using your CompCreator extension, but realised I would have to have a WebViewer component in place anyway in order to get at the any component webviewstring Change block :upside_down_face:

3 Likes

CompCreator mainly use reflection, but this one no need reflection, you may check CustomWebviewer extension.

Awesome. This is painful work but offered us free to one and all. Epic extension
:pray:
:pray:

:+1: :+1: :+1: