Почему Google Forms?
Как известно, формы Google являются удобным, надежным и бесплатным инструментом для взаимодействия с пользователями сайта. Но зачем использовать Google Forms, если существует множество различных компонентов и плагинов (например, для CMS Joomla! — Visforms, RSForm и пр.), которые позволяют организовать обратную связь в рамках одного сайта?
Безусловно, применяя встраиваемые в Ваш сайт формы-компоненты, Вы получаете такие выгоды:
- дизайн форм повторяет дизайн сайта;
- не используются никакие внешние ресурсы;
- пользователь не покидает "границ" Вашего сайта и пр.
Вместе с тем, формы-плагины:
- зависят от хостинга и движка сайта, а поэтому не всегда надежны;
- сложно настраиваемы в плане предоставления доступа для нескольких пользователей и др.
Из собственного опыта скажу, что когда пользователи заполняют и отправляют форму с сайта, а данные записываются в базу лишь частично или возникают какие-то другие баги (первая и главная проблема из описанных выше) — невольно задумываешься о переходе на формы с надежного внешнего ресурса. Я пока остановился на Google Forms.
Автоматизация работы с пользователями
Если Вам нужно просто собрать какую-то информацию (например, адреса пользователей), то самой Google-формы будет вполне достаточно. Однако, в последнее время популярными становятся схемы, когда после заполнения формы пользователю следует, например, передать ссылку на скачивание файла. Разумеется, этот процесс желательно автоматизировать, особенно когда счет пользователей идет на десятки и более.
Пример формы
Рассмотрим данную задачу на примере простой Google-формы. Для этого создадим тестовую заготовку:
Рис. 1. Пример простой Google-формы
После создания формы, Google попросит Вас связать ее с формой ответов (электронной таблицей). Делаем это.
Попытаться обойтись без скрипта?
Далеко не все любят программировать. Если Вы хотите настроить автоматизацию в визуальном режиме, без кода, можно воспользоваться дополнениями к Google Forms:
Рис. 2. Как выбрать и установить дополнение к Google-форме
Откровенно говоря, витрина дополнений к Google Forms выглядит грустно: всего пара десятков дополнений, из которых абсолютно бесплатны лишь несколько. Да и функционал их не всегда отвечает поставленным задачам, поэтому я все же рекомендую настраивать автоматизацию с помощью существенно более гибкого (и абсолютно бесплатного!) инструмента — специального языка программирования Google Script.
Язык программирования (скрипт) Google Script охватывает все основные процессы внутри Вашего облака посредством собственного API. Синтаксически скрипт достаточно прост, и позволяет разрабатывать приложения на основе сценариев с расширением .gs.
Покажем на предыдущем примере, как автоматизировать отправку сообщения тому, кто заполнил нашу тестовую форму.
Работа с таблицей ответов
Данные, которые пользователи будут вводить в поля Google-формы, сохраняются в электронной таблице Google Spreadsheet (облачный аналог MS Excel). Чтобы данные записались в таблицу, нужно запустить форму на выполнение (кнопка "Открыть форму"):
Рис. 3. Пример ввода данных в форму
После нажатия кнопки "Готово" возвращаемся в исходник формы и нажимаем "Просмотреть ответы". Данные каждого нового пользователя будут записаны в отдельную строку:
Рис. 4. Данные пользователя сохранены в таблице
Отправка письма через Google Script
Чтобы сформировать скрипт для отправки сообщения пользователю, перейдем в меню "Инструменты" > "Редактор скриптов...":
Рис. 5. Запуск редактора скриптов
Окно редактора скриптов выглядит следующим образом (название проекта по умолчанию заменено на "Авто-ответ респонденту"):
Рис. 6. Редактор скриптов Google Script
Ниже приведем полный текст скрипта, после чего поясним смысл его ключевых строк.
function sendFormByEmail(e)
{
// instance of Active Spreadsheet:
var responceSheet = SpreadsheetApp.getActiveSheet();
// number of rows in responce form:
var rows = responceSheet.getLastRow();
// range of names, e-mails:
var namesRange = responceSheet.getRange(rows, 2, 1, 1);
var emailsRange = responceSheet.getRange(rows, 3, 1, 1);
// last sender's name, e-mail::
var nameSender = namesRange.getValue();
var emailSender = emailsRange.getValue();
// message ReplyTo, subject, body:
var emailReplyTo = "manager@site.com";
var subject = "Спасибо за Ваш интерес";
var body = "<b>Здравствуйте, " + nameSender + "!</b> <br> Спасибо, что Вы с нами :)";
// send the e-mails:
MailApp.sendEmail(emailSender, emailReplyTo, subject, body);
}
Главная функция скрипта
В строке 1 задаем имя главной функции скрипта, и передаем в нее параметр "e" (данные формы).
Инициализация переменных
В строке 4 мы объявили переменную "responceSheet", которую инициализировали значением активного (открытого в данный момент) листа в электронной таблице. Листов в таблице может быть несколько, но по умолчанию создается один лист, поэтому он всегда будет активным. Класс SpreadsheetApp является стандартным классом Google Script для управления электронными таблицами, а его метод getActiveSheet возвращает активный лист таблицы.
В строке 7 с помощью метода getLastRow записываем в переменную "rows" количество строк нашей таблицы.
В строках 10, 11 инициализируются переменные "namesRange" и "emailsRange" соответственно, отвечающие за списки имен и e-mail всех пользователей (наборы данных). Метод getRange(row, col, rowN, colN) принимает аргументы:
- row, col — номер строки и столбца, с которых начинается диапазон данных, соответственно;
- rowN, colN — количество строк и столбцов, которые охватит диапазон данных, соответственно.
Чтобы отправить сообщение тому пользвателю, который заполнил форму последним, нам всегда нужна последняя строка таблицы (рис. 4), поэтому первым аргументом идет номер последней строки "rows". Далее, все имена будут располагаться в столбце 2, а адреса — в столбце 3. Окончательно, нам понадобится только одна ячейка таблицы, поэтому количество строк и столбцов в методе getRange rowN=1, colN=1.
В строках 14, 15 извлекаем из переменных "namesRange" и "emailsRange" имя и адрес пользователя, и записываем их в строковые переменные "nameSender" и "emailSender", соответственно.
В строках 18, 19, 20 инициализируются строковые переменные, отвечающие за обратный адрес (кому писать ответ), тему и основной текст письма. Основной текст в данном примере содержит некоторые элементы HTML-форматирования, с целью придания сообщению более приятного вида.
Отправка сообщения
Отправка сообщения происходит в строке 23. Используем стандартный класс MailApp, и его метод sendEmail.
Настройка поведения
Если сейчас оставить все "как есть", то при заполнении пользователем нашей Google-формы ничего не произойдет. Чтобы активировать схему взаимодействия, нужно настроить триггеры:
Рис. 7. Настройка триггеров
Удаляем неиспользуемые триггеры (серым цветом) из формы, оставляем один. В поле "Мероприятия" устанавливаем значение "Из таблицы" > "Отправка формы". Этот параметр указывает, что наш скрипт будет выполняться тогда, когда произойдет отправка формы (пользователь нажмет кнопку "Готово").
Перед первой установкой триггеров, Google может потребовать предоставить доступ к некоторым разделам Вашего аккаунта — соглашаемся на это.
Отладка скрипта
Чтобы проверить, как работает наш скрипт, воспользуемся функцией "Отладка":
Рис. 8. Отладка скрипта
Если в коде допущены ошибки, редактор укажет на них. Если ошибок нет, то скрипт запускается на выполнение.
Внимание! Если по логике вашего скрипта происходит чтение данных из таблицы и отправка сообщения, то в режиме отладки так и произойдет — письмо будет отослано по указанному адресу. Пожалуйста, проследите, чтобы пользователи Вашего сайта не получили каких-то отладочных сообщений.
Результат работы
На примере тестовых данных (рис. 3) получим следующий результат:
Рис. 9. Сообщение доставлено
Как видим, сообщение из скрипта было успешно доставлено по указанному нами адресу.
Успехов в освоении Google Forms и Google Script! Оставляйте комментарии, делайте репосты.
P. S. HTML-форматирование
На момент написания статьи, функция SendEmail класса MailApp допускала HTML-форматирование письма, но с более поздними версиями это может не сработать. Чтобы добиться HTML-формата, используйте следующий синтаксис:
MailApp.sendEmail({to: emailSender
, replyTo: emailReplyTo
, subject: subject
, htmlBody: body
});
Комментарии
Вроде делал как написано.
а в Вашей таблице есть данные? Этот метод пытается получить последнюю строку, так что хотя бы одна строка должна присутствовать.
var responceSheet = SpreadsheetApp.getActiveSheet();
Похоже, что null - не удалось получить ссылку на активный лист таблицы
var responceSheet = SpreadsheetApp.getActiveSheet(); стоит перед 7 строкой
У меня не работает html-форматирование текста в теле письма, а очень хочется чтобы сообщение было приятным, в чем может быть проблема?
Вот этого не скажу, не тестировал
var service1 = responceSheet.getRange(rows, 2, 1, 1).getValue();
var service2 = responceSheet.getRange(rows, 3, 1, 1).getValue();
var score = service1 + service2;
var text = "Ваш счет: " + score + " USD";
MailApp.sendEmail({to: adminsite.com, replyTo: adminsite.com, subject: subject, htmlBody: body});
А если результат формы записывается не в последнюю строку в таблице ответов, а в центре, как его получить?
Подскажите, пожалуйста, возможно ли, чтобы ответ на заполненную форму приходил не с адреса аккаунта гугла (...gmail.com) , а с адреса с другим доменом, например zakazmysite.com? Заранее благодарен за ответ.
MailApp.sendEmail({to: emailSender, replyTo: emailReplyTo, subject: subject, htmlBody: body});
Виталий, а подскажите, как в данном скрипте сделать, чтобы дата в письме отображалась в виде "dd.mm.yyyy".
Если более подробно, то в форме человек заполняет дату. Мне эту дату потом нужно внести в отправляемое письмо.
Кодом попытался сделать так:
// range of names, e-mails, summ:
var dataRanges = responceSheet.getRange(rows, 14, 1, 1);
dataRange.setNumberFormat("dd.mm.yyyy");
// last sender's name, e-mail,summ::
var dataSender = dataRange.getValue();
но формат все равно остается в письме Thu Mar 30 2017 00:00:00 GMT+0300 (EAT)!
Если знаете как преобразовать формат даты, буду признателен.
Не появилась ли возможность у Гугл отправлять заранее заготовленное письмо из почты. Форматирование хтмл не работает и письмо получается куцым...
Хотя вообще здорово, что такая возможность есть)
Не нашел пункта меню "Триггеры" в Ресурсах. Что делать? Спасибо
Извините, разобрался сам, нашел в другом месте
Отличное решение - спасибо Вам.
Возникла по факту только одна любопытная проблема - когда вставляю линк на гугл файл в письме - все норм. Но когда укорачиваю его (https://goo.gl/gKjqUH) скрипт перестает работать и отправлять письма)) В чем тут хитрость?)
И еще микро момент - делю до строку через Но получается большой междустрочный интервал, как сделать меньше?
А если еще необходимо будет прицепить вложение?
var htmlWelcomePrice = HtmlService.createHtmlOutputFromFile('welcome').getContent();
MailApp.sendEmail({to: email, replyTo: emailReplyTo, subject: "Скачать прайс-лист", htmlBody: htmlWelcomePrice});
Возможно, это поможет.
Как думаете, почему может приходить всегда сразу по 2 письма?
RSS лента комментариев этой записи