How to call Google Apps Script from a web page

Question

Look for the maximum and lowest for this. I have a basic HTML / CSS / JS webpage. I want users to be able to visit the page and after opening the page, a call was made to the google script that I made, which takes information from the spreadsheet and displays part of it on the page. I hope that I don’t need to make any fancy settings, like in Google tutorials, because none of them were useful to me.

My webpage ----> Google script ----> Google Spreadsheet
My webpage <---- Google script <---- Google spreadsheet

Users should be able to select the item shown on the web page (the item populated with a spreadsheet) and click the button that will allow users to enter a new page with the URL obtained from the selected item.

This is essentially a chat program where chats are stored in a spreadsheet. I want users to be able to also create a new chat room that should update the google spreadsheet.

Answer 1

Take a look at using GET parameters. stack overflow .

Here is the previous question on the topic .

You can access the parameters passed to GET in your doGet(e) function using e.parameter . If you call http://script.google......./exec?method=doSomething , then

 function doGet(e) { Logger.log(e.parameter.method); } 

doSomething will be logged in this case.

Data can be returned from a script using the ContentService , which allows you to serve JSON (I recommend). JSON is the easiest (in my opinion) to do at the end of GAS, as well as use on the client side.

The initial call to the populate list will look something like this. I will write it in jQuery because I feel it is very clean.

 var SCRIPT_URL = "http://script.google.com/[....PUT YOUR SCRIPT URL HERE....]/exec"; $(document).ready(function() { $.getJSON(SCRIPT_URL+"?callback=?", {method:"populate_list"}, function (data) { alert(JSON.stringify(data)); }); }); 

And the corresponding GAS that produces it.

 function doGet(e) { if (e.parameter.method=="populate_list") { var v = {cat:true,dog:false,meow:[1,2,3,4,5,6,4]}; //could be any value that you want to return return ContentService.createTextOutput(e.parameter.callback + "(" + JSON.stringify(v) + ")") .setMimeType(ContentService.MimeType.JAVASCRIPT); } } 

This method is called JSONP, and it is supported by jQuery. jQuery recognizes it when you put ?callback=? after the url. It transfers your output to a callback function, which allows you to execute this function on your site with data as an argument. In this case, the callback function is the one defined in the line that reads function (data) { .