Como comunicar JavaScript con Google Apps Script

Una de las cosas más potentes que podemos hacer con Google Apps Script es comunicar una web que hemos servido de un spreadsheet  con nuestro código Google Apps Script que tenemos en el lado del servidor. Esto lo podemos hacer gracias a que javascript puede llamar a funciones del lado de servidor.

La forma de hacerlo es sencilla, aquí tenéis un ejemplo de un proyecto que hice hace un tiempo:

google.script.run.withSuccessHandler(ReciveList).AskForList();

1. Este código se ha de usar dentro del javascript. 

2. AskForList es una función de Google Apps Script (servidor) a la que llamaremos desde javascript ( cliente )

function AskForList()
{
  var spreadsheet = SpreadsheetApp.getActiveSpreadsheet();
  var sheeturl = spreadsheet.getActiveSheet();
  var images   = sheeturl.getRange(1,1,sheeturl.getLastRow(), 1 ).getValues();

  var elements = new Array();
  for(var i = 1 ; i < images.length ; ++i)
  {
      var url = images[i][0];
      var element = new Object();
      element.url    = url;
      elements.push(element);
  }
  return elements;
}

Esta función puede tener parámetros o no, de forma que podemos llamar a funciones de Google Apps Script con parámetros de datos obtenidos en el HTML ( formularios por ejemplo ), sin ningún tipo de problema.

3. ReciveList es una función de javascript (cliente ) que recoge la respuesta de Google Apps Script ( servidor ).

function ReciveList(list)
{
   //Aqui hacemos lo que queremos con la info que nos devuelve el Google Apps Script         
}

function AskForList()
{
google.script.run.withSuccessHandler(ReciveList).AskForList();
}

Es decir, desde el cliente llamamos a una función del servidor que nos devuelve un contenido que podemos usar en la parte del cliente. Las posibilidades que esto implica son inacabables.

Podemos enviar y recibir a la parte del servidor lo que queramos.

Resumiendo: Con esto, podemos dar información de las acciones del cliente a nuestro spreadsheet, o hacer peticiones al servidor de datos o lo que fuera que necesitemos  mostrar en la web.

Que quede claro que en este flujo de trabajo no está contemplado que la parte del servidor pueda unilateralmente enviar información al cliente, siempre es el cliente ( la web ) quien ha de hacer la petición al servidor ( Google Apps Script)

Es un tema complejo pero extremadamente potente. no dudéis en hacerme todas las preguntas que necesitéis.

Espero que os sirva

Nos vemos








9 comentarios:

  1. No me queda del todo claro, faltaría un ejemplo con una spreadsheet.
    Que debería poner en filldata y en los demás campos.

    ResponderEliminar
  2. Hola. Puede GAS enviar 2 parámetros a JavaScript en una misma función? Ejemplo:
    function getPrueba(){
    let a=5;
    let b=10;
    return a,b;

    }

    ResponderEliminar
    Respuestas
    1. Nope. tal como tu lo explicas no. Sino voy equivocado lo que te serviria seria que puedes devolver arrays y jsons que a efectos practicos son contenedores de tantos datos necesites. Espero que te haya ayudado. Nos vemos!

      Eliminar
    2. Hola Augusto deberías crear un objeto en javascript dentro de la funcion

      Var obj {};
      obj.a =5;
      obj.b =10;

      Eliminar
    3. hola hola, espero no sea muy tarde, depende de como definas el codigo, este puede recibir de 1 a n parametros, a su vez pueden ser arreglos.

      ejemplo 1
      codigo script
      google.run.script.myFuncion(parametro1, parametro2);
      code.gs
      function myFuncion(parametro1, parametro2){
      logger.log(parametro1);
      logger.log(parametro2);

      }

      Eliminar
    4. Hola Jfds,
      Lo que dices es correcto, pero lo que comentaba Augusto, si no voy errado, era el camino contrario.
      Ahi si que no hay más manera que la dije en su momento, creo.
      Gracias por colaborar, nos vemos!

      Eliminar
  3. Hola, aun no entendí como paso parametros a GAS desde el cliente, por ejemplo un array. Gracias por todo

    ResponderEliminar
    Respuestas
    1. Estimado: para pasar un arreglo, por script define tu arreglo hay muchas formas.
      ejemplo script

      var miArreglo = ["nombre1", "apellido1"; "fono1"];
      google.run.script.recibeMiArreglo(miArreglo);

      en el lado del code.gs

      function recibeMiArreglo(datos){

      logger.log(datos);
      var nombre = datos[0];
      var ape = datos[1];
      var fono = datos [2];
      };

      espero te sirva, y ojo es parte de la implementacion que podrias hacer... exito

      Eliminar

Tal vez te interese