Джереми Блум - Изучаем Arduino - инструметы и методы технического волшебства

Сначала используем плату Arduino в качестве веб-сервера. С помощью некоторых HTML-форм и интегрированной библиотеки Ethernet настроим Arduino для автоматического подключения к Сети и выведем веб-страницу, с помощью которой получим доступ для управления некоторыми контактами платы Arduino. Мы разместим кнопки на веб-интерфейсе для переключения цвета RGB-светодиода и управления частотой звука. Наша программа будет расширяемой, что позволит добавлять дополнительные устройства, чтобы более комфортно работать с Arduino.

Настроим оборудование для управления платой Arduino в качестве сервера для управления контактами платы из сети Интернет. Для этого примера возьмем RGB-светодиод и пьезозуммер или обычный динамик. Схема соединения элементов показана на рис. 14.2. Напомним, что контакты 4, 10, 11, 12 и 13 предназначены для связи платы Arduino с адаптером Ethernet. Мы подключаем RGB-светодиод к выводам 5, 6, 7, а динамик - к выводу 3 платы Arduino.

Разработать веб-страницу можно независимо от Arduino. На нашей веб-странице будут простые кнопки для переключения цвета RGB-светодиода и ползунок для регулировки частоты звука, воспроизводимого динамиком. Веб-страница будет отправлять команды из браузера на сервер по протоколу НТТР GET. При разработке дизайна страницы веб-сайт может не быть подключенным к серверу Arduino, на этом этапе не нужно, чтобы взаимодействие со страницей вызывало какие-нибудь действия на плате Arduino.

Откройте свой любимый текстовый редактор (я рекомендую Notepad++ в Windows, который осуществляет визуальное цветовое выделение кода) и создайте новый файл с расширением html. Название не имеет значения, например test.html. Это будет пустая страница, без тегов, которые обычно присутствуют на веб-страницах, например

- 307 -

Рис. 14.2. Схема подключения к Arduino-серверу RGB-светодиода и динамика

Листинг 14.1. HTML-страница с формой - server_form.html

HTML-страница из листинга 14.1 содержит четыре элемента формы. Тег

- 308 -

определяет, какие данные будут переданы на сервер при отправке формы.

В нашем примере переменная называется L и на сервер передается номер необходимого вывода RGB-светодиода. Пустой элемент action указывает, что страница перезагружается при отправке формы. Значение скрытых полей (input с типом hidden) будут отправлены на сервер при нажатии кнопки submit. Для выбора частоты мы добавляем новый HTML-элемент (input с типом range). Это позволяет сделать ползунок диапазона. Вы можете перемещать ползунок с шагом 100 для выбора частоты, которая будет передаваться в переменной с именем s. Старые браузеры не поддерживают этот элемент ( слайдер) и он будет отображаться как поле ввода.

Чтобы увидеть, как будет выглядеть страница, запустите ваш браузер (я рекомендую Google Chrome ). В Chrome нужно нажать комбинацию клавиш + (в Windows) или + (в OS Х), чтобы вызвать диалоговое окно Открыть.

Откройте созданный HTML-файл (рис. 14.3).

Рис. 14.3. Вид нашей веб-страницы в браузере Chrome

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

Теперь нам необходимо созданный HTML-код веб-страницы интегрировать в программу Arduino-сервера, который будет обрабатывать подключение к сети, выдавать на запросы клиентов страницу и обрабатывать переменные, получаемые методом GET.

Благодаря механизму DHCP подключить к сети плату Arduino с Ethemet-адаптером очень просто. Перед обсуждением кода программы давайте посмотрим, как это будет происходить. Вначале нужно подключить библиотеки SPI и Ethemet, определить MAC-адрес вашего Ethemet-адаптера (он указан на этикетке) и создать экземпляр объекта EthernetServer. В функции setup() вы начинаете сеанс Ethernet с MAC-адреса, который вы определили, и запускаете веб-сервер. При необходимости можно назначить статический IP-адрес при инициировании Ethernet, но если этот аргумент пуст, то Arduino будет получать IP-адрес через DCHP и выведет назначенный IP-адрес в последовательный терминал. Затем этот IP-адрес потребуется для подключения к Arduino и просмотра веб-страницы.