Serviço HTML: criar e exibir HTML (original) (raw)

Serviço HTML: criar e exibir HTML

Mantenha tudo organizado com as coleções Salve e categorize o conteúdo com base nas suas preferências.

O serviço HTML permite exibir páginas da Web que podem interagir com as funções do Apps Script do lado do servidor. Ele é particularmente útil para criar apps da Web ou adicionar interfaces do usuário personalizadas nos apps Documentos, Planilhas e Formulários. Você pode até usá-lo para gerar o corpo de um e-mail.

Criar arquivos HTML

Para adicionar um arquivo HTML ao seu projeto do Apps Script, siga estas etapas:

1. Abra o editor do Apps Script.
2. À esquerda, clique em Adicionar um arquivo > HTML.

No arquivo HTML, é possível escrever a maioria dos códigos HTML, CSS e JavaScript do lado do cliente. A página será veiculada como HTML5, embora alguns recursos avançados do HTML5 não estejam disponíveis, conforme explicado emRestrições.

Seu arquivo também pode incluir scriptlets de modelo que são processados no servidor antes que a página seja enviada ao usuário, semelhante ao PHP, conforme explicado na seção sobre HTML com modelo.

Servir HTML como um app da Web

Para criar um app da Web com o serviço HTML, seu código precisa incluir uma função doGet()que informe ao script como exibir a página. A função precisa retornar um objeto HtmlOutput, conforme mostrado neste exemplo.

Code.gs

function doGet() { return HtmlService.createHtmlOutputFromFile('Index'); }

Index.html

Depois que o framework básico estiver em vigor, bastasalvar uma versão do script eimplantar o script como um app da Web.

Depois que o script for implantado como um app da Web, você também poderáincorporá-lo a um site do Google.

Servir HTML como interface do usuário dos apps Documentos, Planilhas, Apresentações ou Formulários Google

O serviço HTML pode mostrar uma caixa de diálogo ou barra lateralnos Documentos, Planilhas, Apresentações ou Formulários Google se o script estivervinculado ao contêiner do arquivo. No Google Forms, as interfaces de usuário personalizadas só ficam visíveis para um editor que abre o formulário para modificá-lo, e não para um usuário que abre o formulário para responder.

Ao contrário de um app da Web, um script que cria uma interface do usuário para um documento, planilha ou formulário não precisa especificamente de uma função doGet(), e você não precisa salvar uma versão do script nem implantá-lo. Em vez disso, a função que abre a interface do usuário precisa transmitir seu arquivo HTML como um objeto HtmlOutput para os métodos showModalDialog()) ou showSidebar() do objeto Ui para o documento, formulário ou planilha ativa.

Esses exemplos incluem alguns recursos extras para conveniência: a função onOpen()cria um menu personalizado que facilita a abertura da interface, e o botão no arquivo HTML invoca um métodoclose() especial da API google.script.host para fechar a interface.

Code.gs

// Use this code for Google Docs, Slides, Forms, or Sheets. function onOpen() { SpreadsheetApp.getUi() // Or DocumentApp or SlidesApp or FormApp. .createMenu('Dialog') .addItem('Open', 'openDialog') .addToUi(); }

function openDialog() { var html = HtmlService.createHtmlOutputFromFile('Index'); SpreadsheetApp.getUi() // Or DocumentApp or SlidesApp or FormApp. .showModalDialog(html, 'Dialog title'); }

Index.html

Na primeira vez que você quiser mostrar essa interface do usuário, será necessário executar a função onOpen() manualmente no editor de scriptou recarregar a janela do editor de Documentos, Planilhas ou Formulários, o que fechará o editor de script. Depois disso, o menu personalizado vai aparecer em alguns segundos sempre que você abrir o arquivo. Escolha Dialog > Open para conferir a interface.