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

[TIMAI2]

GD Connector

Note/Update: Google have "upped the ante" on requirements for app verification, even with the web app I already have verified with them. You need to decide whether you want to jump through all their hoops, or to stick with an unverified web app, which gives your users an uglier first time sign up....

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:
   
   or using the new editor:
   

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:

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

...

Blocks - there are a lot of blocks ;)

Methods

Properties

Events

...

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

Methods

Events

Demo Images

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

Functions.js

Extension
GDConnector

Useful Links
How to apps script project and versions links

• Correctly Deploy a Google Apps Script Web App for AI2
• New Versions for New Google Script Editor
• HOWTO: Create a Google Apps Script Web App bound to a Spreadsheet

GD Connector Site

GD Connector

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

Available for use in any MIT AppInventor projects or competitions

#####################################################################
This work by TIMAI2 is licensed under a
Creative Commons Attribution-ShareAlike 4.0 Unported License with attribution.
Please use name = TIMAI2 and link to this source page when giving credit.
#####################################################################

[Kevinkun]

Wonderful. So many blocks and demo aia.

@TIMAI2

using a webviewer to maintain

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

[TIMAI2]

@Kevinkun

Wonderful

Thank you

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.

@Kevinkun

why not create it dynamically in the source code?

If only I knew how

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

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

[Kevinkun]

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

[Spicy_Topics]

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

[Black_Knight]

how can I pick file from ASD this issue prevents me to upload any file to google drive

[TIMAI2]

Your app has read write access to files in its ASD. Use the file component blocks to return a list of files in your ASD for selection.

[Black_Knight]

please can you present an example by blocks

[TIMAI2]

There are many examples on the community, try a search....

Also check the first post for usage, there is an example to upload a file (using base64 and the script) from the ASD.

[M_Captain]

It says error 403: disallowed_useragent
project does not comply with "use secure browsers" policy

[TIMAI2]

See under the 1.2 update here:

https://community.appinventor.mit.edu/t/webviewextra-upload-download-files-with-webviewer/76346

more needs to be removed from the provided useragent now, or you need to cook your own.

[Sreeraj_Sathish]

Hi, I tried to use this extension, i tried to upload an image to the drive. till conversion of the image to base64 works fine but the upload block is not working. both in the demo.aia you have given and the app i have created. i have tested both upload to file to folder and file to root and still doPost is not called. after debugging a little bit i understood that doPost function is not calling. i haven't tested other block but sign in to the google account works fine in the web viewer. what should i do? code and function is V2 and extension is v1. i dont know if there is any new version or anything.

[TIMAI2]

I have not been near this or used it for a couple of years. As far as I know, nothing has specifically changed that would prevent the extension from working.

I have just tested upload file to root, and it is working OK here. Something to do with your configuration.

[Sreeraj_Sathish]

ahmm i tried using the POST from curl and script works fine. idk maybe my config problem. thanks for testing, now i know the extension is fine. currently trying it using another method if that also doesnt work, is there a way we could work out together?

[TIMAI2]

The issue may be at the script end.

Is it deployed correctly?
Are you using the correct url ?

See here

Everything you wanted to know about Google Apps Script, but were afraid to ask

Well, not quite "everything", but enough to help create a script, deploy it, update it and approve permissions for it, to begin with. Of course, there is the official documentation: Google Apps Script First two guides to deploy a google apps script, standalone and one that is bound to a spreadsheet: Second a guide to update your google apps script to a new version after editing the script: Third a guide to correctly reviewing permissions for a script (this is also covered in the second …