첫번째 예제

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
  </head>
  <body>
    <h1>hello</h1>

    <button id="btn">Run</button>

    <script>
      document.getElementById('btn').addEventListener('click', doStuff);

      function doStuff(){
        google.script.run.userClicked();
      }
    </script>

  </body>
</html>
function doGet(e) {
  Logger.log(e);
  return HtmlService.createHtmlOutputFromFile('page');
}

function userClicked(){
  Logger.log('hello world!');
}

2번째 예제

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
  </head>
  <body>
    <h1>hello</h1>

    <label for="username">name : </label>
    <input type="text" id="username">
    <button id="btn">Run</button>

    <script>
      document.getElementById('btn').addEventListener('click', doStuff);

      function doStuff(){
        var uname = document.getElementById('username').value;
        google.script.run.userClicked(uname);
        document.getElementById('username').value = '';
      }
    </script>

  </body>
</html>
function doGet(e) {
  Logger.log(e);
  return HtmlService.createHtmlOutputFromFile('page');
}

function userClicked(name){
  Logger.log(name + 'hello world!');
}