Дайте вашему проекту Arduino собственный мини-веб-сервер с сетевым экраном

Некоторое время назад я показал вам, как настроить систему управления интернетом для вашего Arduino. Как настроить веб-управление Arduino без щита Ethernet. Как настроить веб-контроль Arduino без щита Ethernet. За последние несколько недель я передал управление настроение в моей студии освещало зрителей во время прямой трансляции Technophilia Podcast - вы можете увидеть результаты этого в… - но он должен был оставаться подключенным к компьютеру через USB, чтобы поддерживать подключение к Интернету. Если у вас есть Ethernet-щит, это не нужно. Сегодня мы рассмотрим настройку Arduino в качестве основного веб-сервера, чтобы мы могли разместить собственный веб-сайт управления устройствами..

Тебе понадобится:

• Arduino, или Arduino клон, как подробно описано здесь. Не тратьте деньги на Arduino - создайте свой собственный за гораздо меньшие деньги Не тратьте деньги на Arduino - создайте свой собственный за гораздо меньше Я люблю свои Arduinos. В любом случае, у меня есть довольно много проектов на ходу - с ними легко создавать прототипы. Но иногда я хочу сохранить работоспособность проекта, не покупая…
• Ethernet Shield (~ $ 35) - убедитесь, что вы получаете версию, соответствующую вашему Arduino, поскольку они не все совместимы
• Запасной порт на маршрутизаторе или коммутаторе и кабель Ethernet
• Пример WebServer, предоставленный в приложении Arduino

Настройка

Экран Ethernet использует контакты С 10 по 13 для управления сетевым подключением, поэтому не включайте их в свой проект; контакт 4 также используется для SD-карты, но мы не будем использовать это сегодня.

Перво-наперво - откройте файл->Примеры->Ethernet->Веб сервер это предусмотрено в Arduino IDE. Найдите строки, ссылающиеся на MAC и IP-адрес.

MAC адрес для меня был найден на коробке - ваш может быть на самом щите. Настройте первую строку значений - нужно оставить предыдущее 0x хоть немного. С технической точки зрения, это не имеет значения, что вы помещаете сюда, если у вас нет конфликтующих значений в вашей подсети - но даже в этом случае это был адрес, назначенный производителем, поэтому мы, вероятно, должны придерживаться этого. Просто знайте, что если вы ошиблись, все равно будет работать.

Далее идет IP-адрес. Нам нужен определенный фиксированный адрес, чтобы мы могли правильно настроить переадресацию портов - щит способен получать адрес от DHCP, но это полезно только в том случае, если он будет использоваться просто как клиент, а не как сервер. Введите IP-адрес, который не используется и запоминается в вашей локальной сети, IP-адрес вашего маршрутизатора и 255.255.255.0 (подсеть). Если для вас ничего из этого не имеет смысла, прочитайте наше бесплатное и подробное руководство по домашней сети. Все, что вам нужно знать о домашней сети. Все, что вам нужно знать о домашней сети. Настройка домашней сети не так сложна, как вы думаете.. .

Перенаправление порта

Изменить строку, которая говорит Сервер EthernetServer (номер), и измените номер на 8081. Это настроит наш сервер на прослушивание порта 8081 в случае, если ваш провайдер блокирует веб-трафик на традиционном порту 80.

Загрузите демо на этом этапе и протестируйте его с локальной машины. Вам, конечно, нужно будет также подключить кабель Ethernet. Держите USB подключенным, так как он нам нужен для питания - вы можете заменить его на 9В позже, но мы все еще тестируем.

Нуб-совет: если вы получаете эту ошибку, это означает, что вы по ошибке поставили капитал O вместо 0 в области MAC-адреса. В шестнадцатеричных значениях нет O! Если вы действительно новичок, возможно, стоит заглянуть в руководство для начинающих Arduino!

Чтобы получить доступ к Arduino, введите адрес и номер порта прямо из браузера..

Вы должны увидеть что-то подобное - пока все хорошо. К сожалению, это доступно только на локальная сеть прямо сейчас, зайдите на страницу конфигурации порта вашего маршрутизатора, чтобы настроить перенаправление с порта 8081 на тот же порт на IP вашего Arduino (Смотрите: что такое переадресация портов? Что такое переадресация портов и как это может мне помочь? [MakeUseOf Объясняет] Что такое перенаправление портов и как оно может мне помочь? [MakeUseOf Explains] Ты немного плачешь внутри, когда кто-то говорит тебе, что есть проблема с переадресацией портов, и именно поэтому твое блестящее новое приложение не будет работать? Ваш Xbox не позволит вам играть в игры, ваши торрент-загрузки отказываются ... )

Проверьте это с мобильного 3G интернет-устройства с отключенным Wi-Fi; не забудьте использовать свой общедоступный IP-адрес, не адрес вашей локальной сети. Ваш маршрутизатор должен быть в состоянии сказать вам это, или просто спросить Google “какой у меня ip“.

Понимание вывода

Страница, обслуживаемая в демо-версии, считывает значения с аналоговых выводов, но поскольку там ничего не связано, вы получите ерунду. Попробуйте подключить датчик света (фоторезистор) к порту A0 а также +5v, с Резистор 10к также на A0 а также ЗЕМЛЯ (это делитель напряжения, так как аналоговые выводы могут считывать только напряжение, а не сопротивление) просто чтобы подтвердить, что сервер действительно читает значения. Обратите внимание, что при изменении интенсивности света значения на других выводах тоже меняются - это потому, что все они не связаны.

Получать Интерактивный

Чтение этих значений - это хорошо, но переход к управление Arduino отсюда - настоящий скачок, и сегодня выходит за рамки этого урока. Вместо того, чтобы заново изобретать колесо, я укажу вам на пользователя форума Arduino Хари, который написал базовый API для взаимодействия с цифровыми выводами. Используя этот код (я изменил его для работы с новейшей библиотекой Ethernet), подключите длинный вывод светодиода (анод) к выводу 8, а короткий вывод - к выводу 7 (с подходящим резистором). Затем вы можете использовать URL формы HTTP: // IP: порт / digitalWrite / 8/1 включить светодиод, и HTTP: // IP: порт / digitalWrite / 8/0 чтобы отключить его, и читать аналоговые значения с analogRead / 0.

Этот пример от bildr также научит вас, как управлять последовательностью светодиодов, читая запрос GET.

Вы также можете воспользоваться этим примером, который выводит форму на странице для управления мигающим светодиодом RGB, хотя вы можете легко адаптировать ее для полосы RGB, такой как проект динамического окружающего освещения. Создайте свое собственное динамическое окружающее освещение для создания медиацентра. Ваше собственное динамическое окружающее освещение для медиацентра Если вы смотрите много фильмов на своем ПК или в медиацентре, я уверен, что вы столкнулись с дилеммой освещения; Вы полностью выключили все огни? Вы держите их на полную мощность? Или ... мы построили некоторое время назад.

Ну, мне было весело строить их, так что я надеюсь, что вы тоже. Если вы сделали библиотеку, которая упрощает обслуживание страниц и элементов управления, пожалуйста, свяжитесь с нами в комментариях.