Google App Script Web App Interaction

0
votes

I am creating a web app to communicate with a spreadsheet. The problem is, from the HTML file, I am calling on functions from the .gs file with my doGet() and a function called doSomething(). When I call on doSomething twice, it only executes once.

My HTML file (called lolcatz.html)

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
  </head>
  <body>
    <script>
      google.script.run.doSomething();
      google.script.run.doSomething2();
      google.script.run.doSomething();
      console.log("Hi");
    </script>
  </body>
</html>

My Google App script file (called Code.gs):

function doGet() {
  var page = HtmlService.createHtmlOutputFromFile('lolcatz.html');
  page.setTitle("Panther Time");
  return page;
}

function doSomething() {
  Logger.log('I was called!');
}
function doSomething2() {
  Logger.log('I was called! Again!');
}

function doStuff() {
  doSomething();
  doSomething2();
}

The log output:

[18-03-28 14:55:00:032 PDT] I was called!

The console.log command executes fine when I go to Inspect Element's JavaScript console.

I am well inside the execution limit and have the Google App Script API and the Google Sheets API enabled.

1
google-apps-script

1 Answers

2
votes

Short answer

The logs on Google Apps Script web IDE are cleared every time that a server-side function is called from the client side because google.script.run makes an asynchronous call and since they are asynchronous we can't sure what we will see on the Logs. If you want to keep the logs then use console.log instead con Logger.log.

Test

To test how client-side code interacts with server-side code that use Logger, try this instead:

lolcatz.html

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
  </head>
  <body>
    <script>
      google.script.run.doSomething('I was called!');
      google.script.run.doSomething2('I was called to!');
      google.script.run.doSomething('I was called again!');
      console.log("Hi");
    </script>
  </body>
</html>

Code.gs

function doGet() {
  var page = HtmlService.createHtmlOutputFromFile('lolcatz.html');
  page.setTitle("Panther Time");
  return page;
}

function doSomething(message) {
  Logger.log(message);
}
function doSomething2(message) {
  Logger.log(message);
}

After opening the Web App

Execution transcript

From View > Execution transcript

[18-03-28 17:36:00:403 CST] Starting execution
[18-03-28 17:36:00:412 CST] Logger.log([I was called again!, []]) [0 seconds]
[18-03-28 17:36:00:414 CST] Execution succeeded [0.002 seconds total runtime]

Logs

From View > Logs

[18-03-28 17:36:00:412 CST] I was called again!

Changing Logger.log by console.log

After changing Logger.log by console.log an opening the web app again (or refreshing the tab)

From View > Stackdriver Logging

2018-03-28 17:43:50.859 CST I was called!
2018-03-28 17:43:51.073 CST I was called to!
2018-03-28 17:43:51.233 CST I was called again!