Различия

Показаны различия между двумя версиями страницы.

Ссылка на это сравнение

Предыдущая версия справа и слеваПредыдущая версия
Следующая версия
Предыдущая версия
products:laboratory_iot:exp62 [2020/06/19 10:18] labuser29products:laboratory_iot:exp62 [2024/12/06 17:17] (текущий) labuser30
Строка 1: Строка 1:
-===== Эксперимент 62. Управление цветом через веб- форму =====+===== Эксперимент 62. Управление цветом через веб-форму =====
  
-Мы уже научились создавать простой веб- сервер, отправлять веб- страницы в браузер клиента и отправлять данные из формы на странице обратно на сервер. Теперь мы сделаем ночник с полноцветным светодиодом, цветом и яркостью которого можно управлять по Wi-Fi через веб- интерфейс. +Мы уже научились создавать простой веб-сервер, отправлять веб-страницы в браузер клиента и отправлять данные из формы на странице обратно на сервер. Теперь мы сделаем ночник с полноцветным светодиодом, цветом и яркостью которого можно управлять по Wi-Fi через веб-интерфейс. 
  
 Для управления RGB светодиодом необходимо передавать на сервер 3 параметра — яркость красного, синего и зеленого цветов. Для управления RGB светодиодом необходимо передавать на сервер 3 параметра — яркость красного, синего и зеленого цветов.
 +
 +Соберем схему с RGB светодиодом
 +
 +==== Схема эксперимента ====
 +
 +{{ :products:esp-iot:exp35_mont.png?direct&600 |}}
 +//Рисунок 1. Монтажная схема эксперимента//
 +
 +==== Программный код эксперимента ====
 +<file html rgb_page.html[enable_line_numbers="2", start_line_numbers_at="1"]>
 +<html>
 +    <head>
 +    </head>
 +    <body>
 +        <form action="/">
 +            Red: <input type="text" name="r" value="<=VALUE=R=>"> <br/>
 +            Green: <input type="text" name="g" value="<=VALUE=G=>"> <br/>
 +            Blue: <input type="text" name="b" value="<=VALUE=B=>"> <br/>
 +            <input type="submit" value="Send">
 +        </form>
 +    </body>
 +</html>
 +</file>
 +
 +Теперь наша форма имеет три текстовых поля с именами ''r'', ''g'' и ''b'' для ввода яркости красного, зеленого и синего цветов соответственно. Также мы вставили три метки, чтобы подменять их на текущее значение яркости перед отправкой страницы пользователю.
 +
 +<WRAP center round important 60%>
 +Сохрани эту страницу в корне файловой системы микроконтроллера под именем rgb_page.html
 +</WRAP>
 +
 +Код программы:
 +
 +<file python Exp62.py[enable_line_numbers="2", start_line_numbers_at="1"]>
 +from micropyserver import MicroPyServer
 +import time
 +from machine import Pin, PWM
 +import network
 +import gc
 +_init()
 +gc.collect()
 +
 +LedR = PWM(Pin(13, Pin.OUT))
 +LedG = PWM(Pin(14, Pin.OUT))
 +LedB = PWM(Pin(15, Pin.OUT))
 +
 +wlan_id = "Wi-Fi_Name"
 +wlan_pass = "Wi-Fi_Password"
 +
 +wlan = network.WLAN(network.STA_IF)
 +wlan.active(True)
 +wlan.connect(wlan_id, wlan_pass)
 +time.sleep(1)
 +
 +while wlan.isconnected() == False:
 +  pass
 +
 +print('Device IP:', wlan.ifconfig()[0])
 +
 +
 +def index(request, params):
 +    duty_r = '512'
 +    duty_g = '512'
 +    duty_b = '512'
 +
 +    if ('r' in params):
 +        duty_r = params['r']
 +        LedR.duty(1023 - int(duty_r))
 +
 +    if ('g' in params):
 +        duty_g = params['g']
 +        LedG.duty(1023 - int(duty_g))
 +
 +    if ('b' in params):
 +        duty_b = params['b']
 +        LedB.duty(1023 - int(duty_b))
 +       
 +
 +    html_file = open("rgb_page.html")
 +    html = html_file.read()
 +
 +    html = html.replace('<=VALUE=R=>', duty_r)
 +    html = html.replace('<=VALUE=G=>', duty_g)
 +    html = html.replace('<=VALUE=B=>', duty_b)
 +
 +    html_file.close()
 +    server.send(html, content_type="Content-Type: text/html")
 +    
 +
 +LedR.duty(0)
 +LedG.duty(0)
 +LedB.duty(0)
 +
 +
 +server = MicroPyServer()
 +server.add_route("/", index)
 +server.start()
 +</file>
 +
 +<WRAP center round important 60%>
 +Первым делом в коде программы нужно заменить ''Wi-Fi_Name'' на имя нужной сети, а ''Wi-Fi_Password'' на пароль от нее.
 +</WRAP>
 +
 +Следует обратить внимание, что перед установкой яркости светодиода мы вычитаем полученные данные из числа 1023. Это сделано потому, что наш RGB светодиод с общим анодом (имеет общий плюс).