Сервопривод SG90 на ESP8266: управление с телефона через веб-слайдер

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

SG90 управление с телефона ESP8266 веб-слайдер

Возможности проекта

Плавное управление углом 0–180° через слайдер. Значение в градусах на экране. Адаптивная страница для телефона. Быстрый отклик без задержек. Легко добавить несколько серво или кнопки. Работает в любой Wi-Fi сети.

Необходимые компоненты

  • ESP8266 (NodeMCU / Wemos D1 mini)
  • Сервопривод SG90 (или MG90S, MG996R)
  • Отдельный источник 5В 1–2А (SG90 потребляет до 650 мА)
  • Провода

Схема подключения

  • Красный (питание) → 5В внешнего блока
  • Коричневый/чёрный (GND) → общий GND с ESP
  • Оранжевый/жёлтый (сигнал) → D4 (GPIO2)

Важно: не питайте серво от 5В ESP — будет дёргаться или не работать!

Библиотеки

  • ESP8266WiFi
  • ESPAsyncWebServer + AsyncTCP
  • Servo (встроенная)

Полный скетч ESP8266

#include <ESP8266WiFi.h>
#include <ESPAsyncWebServer.h>
#include <Servo.h>

Servo myservo;
AsyncWebServer server(80);

const char index_html[] PROGMEM = R"rawliteral(
<!DOCTYPE HTML><html>
<head>
  <meta charset="utf-8">
  <title>Управление SG90</title>
  <style>
    body {font-family: Arial; text-align: center; margin: 50px; background: #222; color: white;}
    h1 {font-size: 32px;}
    input[type=range] {width: 90%; height: 50px;}
    #value {font-size: 60px; color: lime;}
  </style>
</head>
<body>
  <h1>SG90 Управление</h1>
  <input type="range" min="0" max="180" value="90" oninput="fetch('/slider?value='+this.value)">
  <p id="value">90°</p>
  <script>
    setInterval(()=>fetch("/value").then(r=>r.text()).then(v=>document.getElementById("value").innerHTML=v+"°"),500);
  </script>
</body>
</html>)rawliteral";

void setup() {
  myservo.attach(D4);
  myservo.write(90);
  WiFi.begin("SSID", "PASS");
  while (WiFi.status() != WL_CONNECTED) delay(500);

  server.on("/", [](AsyncWebServerRequest *r){ r->send_P(200, "text/html", index_html); });
  server.on("/slider", HTTP_GET, [](AsyncWebServerRequest *r){
    int val = r->arg("value").toInt();
    myservo.write(val);
    r->send(200, "text/plain", "OK");
  });
  server.on("/value", HTTP_GET, [](AsyncWebServerRequest *r){
    r->send(200, "text/plain", String(myservo.read()));
  });
  server.begin();
}
void loop() {}
Делает следующее:
ESP8266 создаёт веб-страницу с ползунком 0–180°.
управляет сервоприводом SG90 на пине D4 в реальном времени.
показывает текущее положение серво на странице.

Заключение

SG90 теперь управляется с телефона плавно и точно. Проект легко расширить: добавить несколько серво, кнопки 0°/90°/180°, сохранение позиции или интеграцию с Telegram.

FAQ — SG90 управление с телефона

Почему серво дергается или не работает?

Питание от ESP8266 слабое. Подключите отдельный источник 5В 1–2А, общий GND обязателен.

Можно ли управлять несколькими SG90?

Да, создайте несколько объектов Servo и отдельные слайдеры с разными URL (/servo1?value=…).

Как изменить диапазон (например 30–150°)?

В слайдере min=»30″ max=»150″, в map замените 0–1023 на нужный диапазон.

Почему угол не точный?

SG90 бюджетный (±5–10°). Для точности используйте MG90S или AS5600 + шаговый мотор.

Можно добавить кнопки 0°/90°/180°?

Да, добавьте <button onclick=»fetch(‘/pos?value=90’)»>90°</button> и обработчик в скетче.

Работает ли с 5В от ESP?

Только для теста без нагрузки. При реальной работе — отдельный источник.

Как добавить Telegram-управление?

Объедините с проектом Telegram-бота — callback_data будет устанавливать угол.

📁 Скачать примеры