Example: Google Sheets NPM

#Example #OAuth #GoogleSheets #GoogleAPIs #WebModules #ServerSide #backend #ServerSide #3rdPartyServices #PackageManager #ExternalCode #NPM

Demonstrates

Required for this example

Links for this example

About this example

This example uses the Google APIs Node.js Client package included in the Wix Package Manager to access a Google Sheet . Using built-in code packages is easier and more convenient than having to write your own interface code.

You will need a Google Account where you can create a Sheet to be used as the “target" of the app. The Home page of this app is a form on which the user can enter data that will be saved to the Google Sheet . Before the Home page form can be used, you will need to configure the app to access the Sheet .

Google APIs use the OAuth 2.0 protocol for authentication and authorization. The Configuration page provides a step-by-step process for you to configure the app to access a Google Sheet . At the end of the configuration process, the form on the Home page can be filled in and the data saved to the Sheet .

Thanks to my Wix colleague Gal who provided the original POC.

15 Likes

Amazing!!! Does it work both ways?

Yisrael,

Honestly, you are the best. I can’t thank you enough. For more than 8 months I was trying to get my head around ‘how to send data to Google Sheet’

I tried it in so many different ways but every time I gave up because I couldn’t figure my head around. If we ever meet, the beer is on me !!

Thank you so much :beers:

-Shan

Awesome code!
I think it will take me few days to understand this lol

The authorization scope in this example is read/write

So you can also read from google spread sheet, you just need to use the correct api call.
as described here:

Hi guys! The get code button doesn’t seem to be working for me. I must be doing something wrong! I’ve enabled the Google Sheets API and downloaded the configuration file. Then copied the text code into the text box and pressed enter. The enter doesn’t seem to be doing anything- it just moves the text cursor to the line below, as you would expect on any word document.

I then create a new Sheet in Google docs and copy it’s URL into the second text box and hit enter. Nothing really happens here either. After this the ‘Get Code’ button still doesn’t seem to work for me. Could anyone enlighten me on what I’m doing wrong?

Heres a link to the page: https://leopoldtaylor.wixsite.com/mysite/configuration
And a screenshot of the code I’ve entered:

I tried your site and it works fine for me. I entered in the text for the client configuration, hit enter, and I get a check mark showing that it was accepted. I then do the same for the Google sheet URL and get a check mark for that as well:


Your site appears to be working OK for me. Do you get the checkmarks as well?

@yisrael-wix Woah- what a quick response! Thanks man. But nope, no checkmarks for me.

@leopoldtaylor Something fishy going on. As you can see:

@leopoldtaylor Are you getting any messages in the WixCode developers console or in the browser’s Javascript console?

@yisrael-wix Not that I can see. I’ve tried it in different browsers and same problem

@leopoldtaylor It seems as if you don’t have a connection to Google. Did you open the browser’s Javascript console? Any messages?

In Chrome, you can open the console like this:

@yisrael-wix Ah yes! My apologies.

@leopoldtaylor Aha! Now we’re getting somewhere.

It seems that you have incorrect permissions on database collection and the insert to the collection is failing. Not sure why this is happening however. Are you running this in Live mode? I’ve been testing Preview from the editor and it works fine, however you might need to adjust the permissions to allow Live mode. This app has also been tested in Live so I’m a bit puzzled why this is happening.

@yisrael-wix Yes I was testing in live. Just tried preview and it’s all working! How might I adjust the permissions? Thanks a bunch for this Yisrael, really appreciate your support.

@leopoldtaylor Wow! I hate it when I’m stupid. :exploding_head:

The wixData.insert() statements were missing the options ( suppressAuth ) parameter which allows the insert() to override the db authorization. See WixDataOptions for more information.

I fixed the example template and I also fixed your backend code to include options in the inserts. You will need to publish - and then try it again.

@leopoldtaylor it is not good idea to publish the credentials online

@leopoldtaylor please remove the credentials data from this post,
it not a good practice to publish it online.

@leopoldtaylor I was going to suggest exactly what @gal-morad post. You should also change your setting and get new credentials just to be safe.

Done. Thanks @yisrael-wix and Gal!