ESP32:Примеры/Машинка-робот как точка доступа с дистанционным WiFi-управлением

Материал из Онлайн справочника
Перейти к: навигация, поиск

Перевод: Максим Кузьмин (Cubewriter)
Перевел 34008 статей для сайта.

Контакты:

Проверка/Оформление/Редактирование: Мякишев Е.А.


Pixel Art Mini Meow Animated.gif Черновик


Машинка-робот как точка доступа с дистанционным WiFi-управлением

В примере Машинка-робот с дистанционным WiFi-управлением мы рассказали о том, как построить машинку-робота с дистанционным управлением, но для нее обязательно требуется беспроводное подключение к WiFi-роутеру.

Это значит, что если вы захотите взять робота в парк, там его тоже нужно будет подключить к беспроводной сети (что не очень удобно). Решение этой проблемы – сделать из ESP32 точку доступа. После этого вам уже не нужно будет подключаться к роутеру, чтобы управлять роботом.

Чтобы настроить ESP32 в качестве точки доступа, нам понадобится та же цепь, но другой скетч.

Задаем SSID и пароль

По умолчанию SSID для ESP32 – это «ESP32-Robot», а пароль – «123456789». Вы, впрочем, можете поменять их в строчках ниже:

  1. const char* ssid = "ESP32-Robot";
  2. const char* password = "123456789";

В блоке setup() появляется новый фрагмент, задающий ESP32 в качестве точки доступа.

  1. // Подключаемся к WiFi-сети
  2. // при помощи заданных выше SSID и пароля:
  3. Serial.print("Setting AP (Access Point)...");
  4.          //  "Настраиваем точку доступа..."
  5. // Если вы хотите, чтобы ваша точка доступа была открытой,
  6. // удалите параметр «password» из метода ниже:
  7. WiFi.softAP(ssid, password);
  8.  
  9. IPAddress IP = WiFi.softAPIP();
  10. Serial.print("AP IP address: ");  //  "IP-адрес точки доступа"
  11. Serial.println(IP);
  12. server.begin();

Другие части кода (в частности, касающиеся веб-страницы) очень похожи на те, что использовались в скетче, где ESP32 не служит точкой доступа, а сама подключается к WiFi-сети.

Загрузив код, перезагрузите ESP32. Монитор порта должен оставаться открытым, чтобы ESP32 напечатала в нем свой IP-адрес.

Esp32 wifirobot ip address serail port 1.PNG

В моем случае это «192.168.4.1» – сохраните его (позже он еще понадобится).

Подключаемся к точке доступа ESP32

Убедитесь, что на ESP32 запущен скетч точки доступа, затем с любого устройства(смартфон, ноутбук, обычный ПК, планшет) выполните поиск точки доступа «ESP32-Robot».

Esp32 wifirobot connect to ap 1.PNG

И используя пароль «123456789» подключитесь к ней.

Esp32 wifirobot connect to ap 2.PNG

Откройте браузер и впишите в его адресной строке IP-адрес, который узнали ранее (у меня это «192.168.4.1»). В результате должна загрузиться вот такая веб-страница:

Esp32 wifirobot connect to ap 3.PNG

Переместите ползунок, чтобы задать скорость, а затем понажимайте на кнопки, чтобы поуправлять роботом. Он должен реагировать точно так же, как если бы на ESP32 был загружен код из примера Машинка-робот с дистанционным WiFi-управлением, где она подключается к роутеру, а не сама служит точкой доступа (как сейчас).

Но у этой новой веб-страницы есть свои отличия:

  • Значение ползунка не показывается;
  • Веб-страница будет обновляться каждый раз, когда вы будете нажимать на кнопки (тем самым делая HTTP-запрос).

Необходимое оборудование

Схема

Pixel Art Mini Meow Animated.gif На этой схеме изображена 36-контактная версия платы ESP32 DEVKIT DOIT V1, поэтому если у вас какая-то другая модель, обязательно сверьтесь с ее распиновкой.


Wifi robot esp32 1.PNG

Начинаем с подключения ESP32 к драйверу моторов. Для размещения ESP32 и построения цепи можно воспользоваться либо небольшой контактной, либо печатной макетной платой. В таблице ниже показано, с помощью каких контактов ESP32 и драйвер моторов L298N необходимо подключить друг к другу.

Драйвер моторов L298N ESP32
IN1 GPIO27
IN2 GPIO26
ENA GPIO14
IN3 GPIO33
IN4 GPIO25
ENB GPIO32

После этого подключите оба мотора к клеммникам драйвера моторов L298N. В целях ослабления скачков напряжения мы рекомендуем припаять к плюсовому и минусовому контактам каждого мотора керамический конденсатор на 100 нФ (как показано на схеме выше).

Кроме того, можно припаять движковый переключатель к красному проводу, идущему от батареек. Благодаря ему вы сможете включать/отключать питание, идущее к моторам и драйверу моторов.

Наконец, запитайте моторы при помощи четырех АА-батареек, подключив их к портам питания драйвера моторов. Так как наш робот должен быть портативным, ESP32 будет питаться от пауэрбанка. Прикрепите его к шасси, например, при помощи ленты-липучки.

Код

  1. /*********
  2.   Руи Сантос
  3.   Более подробно о проекте на: http://randomnerdtutorials.com  
  4. *********/
  5.  
  6. // Загружаем библиотеку для WiFi:
  7. #include <WiFi.h>
  8.  
  9. // В двух строчках ниже пишем SSID и пароль для своей WiFi-сети:
  10. const char* ssid     = "ESP32-Robot";
  11. const char* password = "123456789";
  12.  
  13. // Создаем объект сервера и задаем ему порт «80»:
  14. WiFiServer server(80);
  15.  
  16. // Переменная для хранения HTTP-запроса:
  17. String header;
  18.  
  19. // Мотор 1:
  20. int motor1Pin1 = 27;
  21. int motor1Pin2 = 26;
  22. int enable1Pin = 14;
  23.  
  24. // Мотор 2:
  25. int motor2Pin1 = 33;
  26. int motor2Pin2 = 25;
  27. int enable2Pin = 32;
  28.  
  29. // Переменные для свойств ШИМ:
  30. const int freq = 30000;
  31. const int pwmChannel = 0;
  32. const int resolution = 8;
  33. int dutyCycle = 0;
  34.  
  35. // Переменные для расшифровки HTTP-запроса GET:
  36. String valueString = "0";
  37. int pos1 = 0;
  38. int pos2 = 0;
  39.  
  40. void setup() {
  41.   Serial.begin(115200);
  42.  
  43.   // Переключаем контакты моторов в режим «OUTPUT»:
  44.   pinMode(motor1Pin1, OUTPUT);
  45.   pinMode(motor1Pin2, OUTPUT);
  46.   pinMode(motor2Pin1, OUTPUT);
  47.   pinMode(motor2Pin2, OUTPUT);
  48.  
  49.   // Задаем настройки для ШИМ-канала:
  50.   ledcSetup(pwmChannel, freq, resolution);
  51.  
  52.   // Подключаем ШИМ-канал 0 к контактам ENA и ENB,
  53.   // т.е. к GPIO-контактам для управления скоростью моторов:
  54.   ledcAttachPin(enable1Pin, pwmChannel);
  55.   ledcAttachPin(enable2Pin, pwmChannel);
  56.  
  57.   // Генерируем ШИМ-сигнал для контактов ENA и ENB
  58.   // с коэффициентом заполнения «0»:
  59.   ledcWrite(pwmChannel, dutyCycle);
  60.  
  61.   // Подключаемся к WiFi-сети
  62.   // при помощи заданных выше SSID и пароля:
  63.   Serial.print("Setting AP (Access Point)...");
  64.            //  "Настраиваем точку доступа..."
  65.   // Если вы хотите, чтобы ваша точка доступа была открытой,
  66.   // удалите параметр «password» из метода ниже:
  67.   WiFi.softAP(ssid, password);
  68.  
  69.   IPAddress IP = WiFi.softAPIP();
  70.   Serial.print("AP IP address: ");  //  "IP-адрес точки доступа"
  71.   Serial.println(IP);
  72.  
  73.   server.begin();
  74. }
  75.  
  76. void loop(){
  77.   WiFiClient client = server.available();  // Запускаем прослушку
  78.                                            // входящих клиентов.
  79.  
  80.   if (client) {                            // Если подключился
  81.                                            // новый клиент,
  82.     Serial.println("New Client.");         // печатаем в монитор порта  
  83.                                            // сообщение об этом.
  84.     String currentLine = "";               // Создаем строку
  85.                                            // для хранения данных,
  86.                                            // пришедших от клиента.
  87.     while (client.connected()) {           // Запускаем цикл while(),
  88.                                            // который будет работать,
  89.                                            // пока клиент подключен.
  90.       if (client.available()) {            // Если у клиента
  91.                                            // есть байты, которые
  92.                                            // можно прочесть,
  93.         char c = client.read();            // считываем байт
  94.         Serial.write(c);                   // и печатаем его
  95.                                            // в мониторе порта.
  96.         header += c;
  97.         if (c == '\n') {                   // Если полученный байт –
  98.                                            // это символ новой строки.
  99.           // Если мы получили два символа новой строки подряд,
  100.           // то это значит, что текущая строка пуста.
  101.           // Это конец HTTP-запроса клиента, поэтому шлём ответ:
  102.           if (currentLine.length() == 0) {
  103.             // HTTP-заголовки всегда начинаются с кода ответа
  104.             // (например, «HTTP/1.1 200 OK») и данных о типе контента,
  105.             // чтобы клиент знал, что получает,
  106.             // а после этого пишем пустую строчку:
  107.             client.println("HTTP/1.1 200 OK");
  108.             client.println("Content-type:text/html");
  109.             client.println("Connection: close");
  110.                        //  "Соединение: отключено"
  111.             client.println();
  112.            
  113.             // Включаем и выключаем GPIO-контакты:
  114.             if (header.indexOf("GET /forward") >= 0) {
  115.               Serial.println("Forward");  //  "Вперед"
  116.               digitalWrite(motor1Pin1, LOW);
  117.               digitalWrite(motor1Pin2, HIGH);
  118.               digitalWrite(motor2Pin1, LOW);
  119.               digitalWrite(motor2Pin2, HIGH);
  120.             }  else if (header.indexOf("GET /left") >= 0) {
  121.               Serial.println("Left");  //  "Влево"
  122.               digitalWrite(motor1Pin1, LOW);
  123.               digitalWrite(motor1Pin2, LOW);
  124.               digitalWrite(motor2Pin1, LOW);
  125.               digitalWrite(motor2Pin2, HIGH);
  126.             }  else if (header.indexOf("GET /stop") >= 0) {
  127.               Serial.println("Stop");  //  "Стоп"
  128.               digitalWrite(motor1Pin1, LOW);
  129.               digitalWrite(motor1Pin2, LOW);
  130.               digitalWrite(motor2Pin1, LOW);
  131.               digitalWrite(motor2Pin2, LOW);            
  132.             } else if (header.indexOf("GET /right") >= 0) {
  133.               Serial.println("Right");  //  "Вправо"
  134.               digitalWrite(motor1Pin1, LOW);
  135.               digitalWrite(motor1Pin2, HIGH);
  136.               digitalWrite(motor2Pin1, LOW);
  137.               digitalWrite(motor2Pin2, LOW);    
  138.             } else if (header.indexOf("GET /reverse") >= 0) {
  139.               Serial.println("Reverse");  //  "Назад"
  140.               digitalWrite(motor1Pin1, HIGH);
  141.               digitalWrite(motor1Pin2, LOW);
  142.               digitalWrite(motor2Pin1, HIGH);
  143.               digitalWrite(motor2Pin2, LOW);          
  144.             }
  145.             // Показываем веб-страницу:
  146.             client.println("<!DOCTYPE HTML><html>");
  147.             client.println("<head><meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">");
  148.             client.println("<link rel=\"icon\" href=\"data:,\">");
  149.             // При помощи CSS задаем стиль кнопок.
  150.             // Попробуйте поэкспериментировать
  151.             // с атрибутами «background-color» и «font-size»,
  152.             // чтобы стилизовать кнопки согласно своим предпочтениям:
  153.             client.println("<style>html { font-family: Helvetica; display: inline-block; margin: 0px auto; text-align: center;}");
  154.             client.println(".button { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; background-color: #4CAF50;");
  155.             client.println("border: none; color: white; padding: 12px 28px; text-decoration: none; font-size: 26px; margin: 1px; cursor: pointer;}");
  156.             client.println(".button2 {background-color: #555555;}</style></head>");
  157.            
  158.             // Веб-страница:        
  159.             client.println("<p><a href=\"/forward\"><button class=\"button\" onclick=\"moveForward()\">FORWARD</button></a></p>");
  160.             client.println("<div style=\"clear: both;\"><p><a href=\"/left\"><button class=\"button\" onclick=\"moveLeft()\">LEFT </button></a>");
  161.             client.println("<a href=\"/stop\"><button class=\"button button2\" onclick=\"stopRobot()\">STOP</button></a>");
  162.             client.println("<a href=\"/right\"><button class=\"button\" onclick=\"moveRight()\">RIGHT</button></a></p></div>");
  163.             client.println("<p><a href=\"/reverse\"><button class=\"button\" onclick=\"moveReverse()\">REVERSE</button></a></p>");        
  164.             client.println("<input type=\"range\" min=\"0\" max=\"100\" step=\"25\" id=\"motorSlider\" onchange=\"motorSpeed(this.value)\" value=\"" + valueString + "\"/>");
  165.            
  166.             client.println("<script> function motorSpeed(pos) { ");
  167.             client.println("var xhr = new XMLHttpRequest();");
  168.             client.println("xhr.open('GET', \"/?value=\" + pos + \"&\", true);");
  169.             client.println("xhr.send(); } </script>");
  170.            
  171.             client.println("</html>");
  172.            
  173.             // Пример запроса: «GET /?value=100& HTTP/1.1»;
  174.             // Он задает коэффициент заполнения ШИМ на 100%:
  175.             if(header.indexOf("GET /?value=")>=0) {
  176.               pos1 = header.indexOf('=');
  177.               pos2 = header.indexOf('&');
  178.               valueString = header.substring(pos1+1, pos2);
  179.               // Задаем скорость мотора:
  180.               if (valueString == "0") {
  181.                 ledcWrite(pwmChannel, 0);
  182.                 digitalWrite(motor1Pin1, LOW);
  183.                 digitalWrite(motor1Pin2, LOW);
  184.                 digitalWrite(motor2Pin1, LOW);
  185.                 digitalWrite(motor2Pin2, LOW);  
  186.               }
  187.               else {
  188.                 dutyCycle = map(valueString.toInt(), 25, 100, 200, 255);
  189.                 ledcWrite(pwmChannel, dutyCycle);
  190.                 Serial.println(valueString);
  191.               }
  192.             }        
  193.             // HTTP-ответ заканчивается еще одной пустой строкой:
  194.             client.println();
  195.             // Выходим из цикла while():
  196.             break;
  197.           } else {  // Если получили символ новой строки,
  198.                     // очищаем переменную «currentLine»
  199.             currentLine = "";
  200.           }
  201.         } else if (c != '\r') {  // Если получили что-либо,
  202.                                  // кроме символа возврата каретки,
  203.           currentLine += c;      // добавляем эти данные
  204.                                  // в конец переменной «currentLine»
  205.         }
  206.       }
  207.     }
  208.     // Очищаем переменную «header»:
  209.     header = "";
  210.     // Отключаем соединение:
  211.     client.stop();
  212.     Serial.println("Client disconnected.");  //  "Клиент отключился."
  213.     Serial.println("");
  214.   }
  215. }

См.также

Внешние ссылки