Clase google.script.host (API del cliente)

google.script.host es una API de JavaScript asíncrona del lado del cliente que puede interactuar con cuadros de diálogo o barras laterales en Documentos, Hojas de cálculo o Formularios de Google que contienen páginas de servicio HTML. Para ejecutar funciones del servidor desde el código del cliente, usa google.script.run. Si deseas obtener más información, consulta la guía para comunicarte con las funciones del servidor en el servicio HTML.

Propiedades

PropiedadDescripción
originProporciona el dominio del host para que las secuencias de comandos puedan establecer su origen de forma correcta.

Métodos

MétodoTipo de datos que se muestraDescripción breve
close() void Cierra el cuadro de diálogo o la barra lateral actuales.
editor.focus() void Cambia el enfoque del navegador desde el cuadro de diálogo o la barra lateral al editor de Formularios, Hojas de cálculo o Documentos de Google.
setHeight(height) void Establece la altura del diálogo actual.
setWidth(width) void Establece el ancho del diálogo actual.

Documentación detallada

close()

Cierra el cuadro de diálogo o la barra lateral actuales.

Code.gs

function onOpen(e) {
  SpreadsheetApp.getUi() // Or DocumentApp or FormApp.
      .createMenu('Sidebar').addItem('Show', 'showSidebar').addToUi();
}

function showSidebar() {
  var html = HtmlService.createHtmlOutputFromFile('Index');
  SpreadsheetApp.getUi() // Or DocumentApp or FormApp.
      .showSidebar(html);
}

Índice html

<input type="button" value="Close"
  onclick="google.script.host.close()" />

editor.focus()

Cambia el enfoque del navegador desde el cuadro de diálogo o la barra lateral al editor de Formularios, Hojas de cálculo o Documentos de Google.

Code.gs

function onOpen(e) {
  SpreadsheetApp.getUi() // Or DocumentApp or FormApp.
      .createMenu('Sidebar').addItem('Show', 'showSidebar').addToUi();
}

function showSidebar() {
  var html = HtmlService.createHtmlOutputFromFile('Index');
  SpreadsheetApp.getUi() // Or DocumentApp or FormApp.
      .showSidebar(html);
}

Índice html

<input type="button" value="Switch focus"
  onclick="google.script.host.editor.focus()" />

setHeight(height)

Establece la altura del diálogo actual.

Code.gs

function onOpen(e) {
  SpreadsheetApp.getUi() // Or DocumentApp or FormApp.
      .createMenu('Dialog').addItem('Show', 'showDialog').addToUi();
}

function showDialog() {
  var html = HtmlService.createHtmlOutputFromFile('Index')
      .setWidth(300)
      .setHeight(200);
  SpreadsheetApp.getUi() // Or DocumentApp or FormApp.
      .showModalDialog(html, 'Dialog title');
}

Índice html

<script>
  function resizeDialog(width, height) {
    google.script.host.setWidth(width);
    google.script.host.setHeight(height);
  }
</script>
<input type="button" value="Resize dialog"
  onclick="resizeDialog(450, 300)" />

Parámetros

NombreTipoDescripción
heightIntegerla nueva altura, en píxeles

setWidth(width)

Establece el ancho del diálogo actual.

Code.gs

function onOpen(e) {
  SpreadsheetApp.getUi() // Or DocumentApp or FormApp.
      .createMenu('Dialog').addItem('Show', 'showDialog').addToUi();
}

function showDialog() {
  var html = HtmlService.createHtmlOutputFromFile('Index')
      .setWidth(300)
      .setHeight(200);
  SpreadsheetApp.getUi() // Or DocumentApp or FormApp.
      .showModalDialog(html, 'Dialog title');
}

Índice html

<script>
  function resizeDialog(width, height) {
    google.script.host.setWidth(width);
    google.script.host.setHeight(height);
  }
</script>
<input type="button" value="Resize dialog"
  onclick="resizeDialog(450, 300)" />

Parámetros

NombreTipoDescripción
widthIntegerel nuevo ancho, en píxeles