Оптимизация структуры веб-страниц. Практическое использование CDN на примере Google Apps

Задание. Написать скрипт в Google Apps Script.

В Google Apps Script можно использовать HTML страницы со скриптами (javascript) и даже JQuery. Для примера создадим новую таблицу в GoogleSheet. В ней создадим 2 вкладки: test и problems.

На вкладке test сделаем кнопку (для удобства), по которой будет вызваться наш скрипт:


На вкладке problems сделаем таблицу с 3 столбцами - Имя, Браузер, Описание проблемы:


Теперь заходим в редактор скриптов и создаем новую HTML страницу с названием index:

Google Docs

На этой странице делаем простенькую форму с полями для ввода имени, выбора браузера и описания проблемы. И добавляем 2 кнопки - очистить и отправить. На отправить вешаем скрипт на нажатие кнопки - clickButton()

Google Docs

Выглядеть эта форма будет вот так:

Google Docs

Скрипт на нажатие кнопки - clickButton() - выглядит следующим образом и пишется после тега form:

Google Docs

Теперь настало время написать серверный скрипт (в нашем случае - это обычный, стандартный Google Apps Script). Переименовываем автоматически созданный скрипт с названием Код на test и создаем 2 функции:

Google Docs

В функции test мы задаем, что из нашего файла index.html мы создаем HTMLOutput и специально командной показываем модальное окно.

В функции writeToProblem мы получаем 3 значения из HTML формы, записываем их на страницу problems и возвращаем true.

Осталось только к нашей картинке назначить скрипт test и можно проверять результаты нашей работы!

Google Docs

Теперь просто нажимаем на нашу кнопку, появляется форма. Заполняем форму, нажимаем отправить - и на нашей вкладке problems появляется новая запись!




Комментарии