Что такое Google Apps Script и для чего он нужен?

Google Apps Script (GAS) – это облачная платформа разработки, позволяющая автоматизировать задачи и расширять функциональность Google Workspace (Sheets, Docs, Forms, Slides, Gmail и других). С его помощью можно создавать веб-приложения, которые взаимодействуют с сервисами Google и внешними API. GAS использует JavaScript в качестве языка программирования и предоставляет обширный набор библиотек для упрощения разработки.

Саммари статьи

ChatGPT

Google AI

Grok

Perplexity

Преимущества использования Google Apps Script для веб-приложений

Простота и доступность: GAS не требует сложной настройки окружения, все инструменты доступны прямо в браузере.

Интеграция с Google Workspace: Легкая интеграция с сервисами Google делает GAS идеальным для автоматизации рабочих процессов.

Бесплатное использование: GAS предоставляется бесплатно для личного и коммерческого использования (в пределах лимитов).

Быстрая разработка: Готовые библиотеки и API упрощают и ускоряют разработку веб-приложений.

Обзор возможностей и ограничений веб-приложений GAS

Веб-приложения GAS позволяют создавать:

Простые веб-страницы с формами для сбора данных.

Интерактивные дашборды с данными из Google Sheets.

Автоматизированные системы отправки email-рассылок.

Webhook-и для интеграции с внешними сервисами.

Ограничения GAS включат лимиты на время выполнения скриптов, количество запросов к API и объем обрабатываемых данных. Важно учитывать эти ограничения при проектировании сложных приложений.

Создание простого веб-приложения: «Hello, World!»

Настройка окружения Google Apps Script (создание скрипта)

Откройте Google Drive.

Нажмите "Создать" -> "Еще" -> "Google Apps Script".

Откроется редактор скриптов GAS.

Дайте скрипту имя, например, "HelloWorldWebApp".

Написание кода для обработки GET-запроса

/**
 * @OnlyCurrentDoc
 */

/**
 * Обрабатывает GET-запрос и возвращает HTML-страницу с приветствием.
 * 
 * @param {GoogleAppsScript.Events.DoGet} e Объект события GET-запроса.
 * @return {GoogleAppsScript.HTML.HtmlOutput} HTML-контент для отображения.
 */
function doGet(e: GoogleAppsScript.Events.DoGet): GoogleAppsScript.HTML.HtmlOutput {
  // Создаем HTML-страницу с приветствием
  return HtmlService.createHtmlOutput('
Hello, World!
');
}

Развертывание веб-приложения и получение URL

В редакторе скриптов нажмите "Развернуть" -> "Новое развертывание".

Выберите тип развертывания "Веб-приложение".

В поле "От имени" выберите свою учетную запись Google.

В поле "Кто имеет доступ" выберите "Все" (или "Все, у кого есть ссылка", если хотите ограничить доступ).

Нажмите "Развернуть".

Скопируйте URL веб-приложения из появившегося окна.

Проверка работоспособности приложения в браузере

Вставьте скопированный URL в адресную строку браузера и нажмите Enter. Вы должны увидеть страницу с надписью "Hello, World!".

Обработка данных формы с использованием POST-запросов

Создание HTML-формы для ввода данных

Создайте HTML-файл (например, index.html) со следующим содержимым:

  


  
    Name:

    


    Email:

    


    
  
  


  
   function onSuccess(data) {
     document.getElementById('output').innerHTML = data;
   }
   
   function processForm(formObject) {
     google.script.run.withSuccessHandler(onSuccess).processForm(formObject);
   }
  

Написание функции doPost(e) для обработки POST-запросов

/**
 * Обрабатывает POST-запрос от формы.
 * 
 * @param {GoogleAppsScript.Events.DoPost} e Объект события POST-запроса.
 */
function doPost(e: GoogleAppsScript.Events.DoPost): GoogleAppsScript.HTML.HtmlOutput {
  // Получаем параметры из запроса
  const params = e.parameter;
  
  // Обрабатываем данные (пример: выводим их в лог)
  Logger.log(params);

  // Возвращаем HTML-ответ
  return HtmlService.createHtmlOutput(`Данные получены: ${JSON.stringify(params)}`);
}


/**
 * Отображает HTML страницу в doGet.
 * 
 * @param {GoogleAppsScript.Events.DoGet} e Объект события GET-запроса.
 * @return {GoogleAppsScript.HTML.HtmlOutput} HTML-контент для отображения.
 */
function doGet(e: GoogleAppsScript.Events.DoGet): GoogleAppsScript.HTML.HtmlOutput {
  return HtmlService.createHtmlOutputFromFile('index');
}


/**
 * Process the form data
 * @param {HTMLFormElement} formObject The form to process
 */
function processForm(formObject: HTMLFormElement): string {
  const name: string = formObject.name;
  const email: string = formObject.email;

  // Here you can do something useful like writing to a spreadsheet
  return `Thank you ${name}, your email ${email} was recorded.`
}

Получение и обработка данных из объекта ‘e’

Внутри функции doPost(e) данные формы доступны через объект e.parameter. Этот объект содержит все поля формы в виде пар "ключ-значение".

Примеры использования данных (запись в Google Sheets, отправка email)

Запись в Google Sheets:

function doPost(e: GoogleAppsScript.Events.DoPost): GoogleAppsScript.HTML.HtmlOutput {
  const params = e.parameter;
  const ss = SpreadsheetApp.getActiveSpreadsheet();
  const sheet = ss.getActiveSheet();
  sheet.appendRow([params.name, params.email, new Date()]);

  return HtmlService.createHtmlOutput(`Данные записаны в таблицу: ${JSON.stringify(params)}`);
}

Отправка email:

function doPost(e: GoogleAppsScript.Events.DoPost): GoogleAppsScript.HTML.HtmlOutput {
  const params = e.parameter;
  MailApp.sendEmail({
    to: params.email,
    subject: 'Спасибо за заполнение формы!',
    body: `Уважаемый(ая) ${params.name},

Спасибо за заполнение формы!  Мы получили вашу заявку.
`
  });

  return HtmlService.createHtmlOutput(`Email отправлен на адрес: ${params.email}`);
}

Работа с Google Sheets API в веб-приложении

Авторизация доступа к Google Sheets

GAS автоматически предоставляет доступ к Google Sheets, если скрипт и таблица находятся в одной учетной записи.

Чтение данных из таблицы Google Sheets

function getDataFromSheet(): any[][] {
  const ss = SpreadsheetApp.getActiveSpreadsheet();
  const sheet = ss.getActiveSheet();
  const range = sheet.getDataRange();
  const values = range.getValues();
  return values;
}

Запись данных в таблицу Google Sheets

function writeDataToSheet(data: any[]): void {
  const ss = SpreadsheetApp.getActiveSpreadsheet();
  const sheet = ss.getActiveSheet();
  sheet.appendRow(data);
}

Примеры: динамическое обновление контента веб-страницы из Google Sheets

Предположим, у вас есть таблица с данными о продуктах (название, цена, описание). Вы можете создать веб-приложение, которое будет динамически отображать эти данные на странице. Для этого:

Получите данные из таблицы с помощью getDataFromSheet().

Сформируйте HTML-код на основе полученных данных.

Верните HTML-код в качестве ответа на GET-запрос.

Пример:

function doGet(e: GoogleAppsScript.Events.DoGet): GoogleAppsScript.HTML.HtmlOutput {
  const data = getDataFromSheet();
  let html = '
';
  for (let i = 1; i < data.length; i++) { // предполагаем, что первая строка - заголовки
    html += `
${data[i][0]} - ${data[i][1]} - ${data[i][2]}
`;
  }
  html += '
';
  return HtmlService.createHtmlOutput(html);
}

Расширенные возможности и советы по разработке веб-приложений

Использование HTML Service для создания динамических интерфейсов

HTML Service позволяет создавать динамические веб-страницы с использованием JavaScript на стороне клиента. Вы можете использовать JavaScript для обработки событий, обновления контента и взаимодействия с сервером.

Работа с шаблонами HTML (Template HTML)

Шаблоны HTML позволяют создавать HTML-страницы с динамическим контентом. Вы можете использовать <%= ... %> для вставки значений переменных в HTML-код.

Пример:

  


  
Hello, !

function doGet(e: GoogleAppsScript.Events.DoGet): GoogleAppsScript.HTML.HtmlOutput {
  const template = HtmlService.createTemplateFromFile('template');
  template.name = 'World';
  return template.evaluate();
}

Обработка ошибок и отладка веб-приложений

Используйте Logger.log() для вывода информации в лог. Лог доступен в редакторе скриптов (Вид -> Логи).

Для обработки ошибок используйте блоки try...catch.

Рекомендации по безопасности и оптимизации производительности

Валидация данных: Всегда проверяйте данные, получаемые от пользователя, на соответствие ожидаемым форматам и значениям.

Избегайте хранения секретной информации в коде: Используйте Properties Service для хранения API-ключей и других секретных данных.

Оптимизируйте запросы к API: Старайтесь минимизировать количество запросов к API, чтобы избежать превышения лимитов.

Кэширование: Используйте Cache Service для кэширования часто используемых данных.

Асинхронные вызовы: Используйте асинхронные вызовы для выполнения длительных операций в фоновом режиме, чтобы не блокировать основной поток.