Skip to main content

📡 Простая отправка данных на школьный сервер

🎯 Цели и планируемые результаты урока

Предметные результаты:

  • Понимание архитектуры Client-Server и принципов работы API
  • Освоение основ HTTP протокола (GET/POST запросы)
  • Навыки работы с готовыми API endpoints
  • Умение отправлять структурированные данные в формате JSON
  • Практические навыки интеграции ESP32 с веб-системами
  • Создание персональной страницы с данными от своего устройства

Метапредметные результаты:

  • Развитие понимания взаимодействия между устройствами
  • Формирование навыков работы с API документацией
  • Умение структурировать и передавать информацию
  • Развитие навыков отладки сетевых приложений

Личностные результаты:

  • Понимание роли данных в современном мире
  • Формирование ответственного отношения к передаваемой информации
  • Развитие навыков командной работы в цифровой среде

🚀 Мотивационное начало (7 минут)

“Превращение ESP32 в цифрового репортера”

Учитель демонстрирует ESP32, который отправляет данные на сервер, и они мгновенно появляются на большом экране

📊 Живая демонстрация магии данных:

🌡️ ESP32 измеряет температуру: 23.5°C
📡 Отправляет данные на сервер...
💻 На экране появляется: "Класс 5А: 23.5°C - 15:18:46"
📈 График обновляется в реальном времени
🎉 Ваше имя появляется в списке активных устройств!

🎭 Интерактивная аналогия “Цифровые корреспонденты”:

📰 ТРАДИЦИОННАЯ ЖУРНАЛИСТИКА    ↔    📡 IoT РЕПОРТИНГ
📝 Репортер пишет заметку       ↔    🤖 ESP32 собирает данные  
📞 Звонит в редакцию            ↔    📡 Отправляет HTTP запрос
🗞️ Статья попадает в газету     ↔    💻 Данные на веб-странице
👥 Люди читают новости          ↔    📊 Анализируют информацию

🌟 Интрига урока: “Сегодня каждый ваш ESP32 станет цифровым журналистом, который будет рассказывать миру о том, что происходит в нашем классе!”

🎯 Вызов дня: “К концу урока у каждого из вас будет персональная страница в интернете с данными от вашего собственного IoT устройства!”

📖 Основная часть урока

Блок 1: “Client-Server архитектура - понимаем роли” (12 минут)

🏪 “Магазин и покупатель - идеальная аналогия”

Разыгрываем сценку с учениками:

🏪 CLIENT-SERVER = МАГАЗИН И ПОКУПАТЕЛЬ:

👤 КЛИЕНТ (ESP32):                🏪 СЕРВЕР (Raspberry Pi):
"Здравствуйте!"               ↔   "Добро пожаловать!"
"Можно данные передать?"       ↔   "Конечно! Какие данные?"
"Температура 23.5°C"           ↔   "Принято! Данные сохранены"
"Спасибо! До свидания!"        ↔   "Пожалуйста! Заходите еще!"

🎯 РОЛИ:
CLIENT: Тот, кто ПРОСИТ услугу (наш ESP32)
SERVER: Тот, кто ПРЕДОСТАВЛЯЕТ услугу (школьный сервер)

📡 “HTTP протокол - язык общения в интернете”

Простое объяснение через письма:

📮 HTTP = ФОРМАТ ЦИФРОВЫХ ПИСЕМ:

✉️ GET ЗАПРОС (как вопрос):
"Уважаемый сервер! 
Не могли бы вы показать мне страницу с данными?
С уважением, ESP32"

📤 POST ЗАПРОС (как отчет):
"Уважаемый сервер!
Докладываю данные:
- Устройство: ESP32_5А_Команда1
- Температура: 23.5°C  
- Время: 15:18:46
С уважением, ESP32"

📨 ОТВЕТ СЕРВЕРА:
"Дорогой ESP32!
Ваши данные получены и сохранены.
Код ответа: 200 (все хорошо)
С уважением, Школьный сервер"

🔍 “Анатомия HTTP запроса”

Разбираем по частям:

📋 СТРУКТУРА HTTP POST ЗАПРОСА:

POST /api/sensor-data HTTP/1.1          ← Метод и адрес
Host: 192.168.1.100                     ← Адрес сервера
Content-Type: application/json          ← Тип данных
Content-Length: 156                     ← Размер данных

{                                       ← Начало данных
  "device": "ESP32_5А_Команда1",
  "student": "Иван Петров",
  "class": "5А", 
  "temperature": 23.5,
  "timestamp": "2025-05-27T15:18:46"
}                                       ← Конец данных

🗣️ НА ПРОСТОМ ЯЗЫКЕ:
"Привет сервер! Это POST запрос к адресу /api/sensor-data.
Я отправляю JSON данные размером 156 байт.
Вот мои данные о температуре..."

🎯 Интерактивное задание “HTTP театр”

Ученики играют роли компонентов:

  • ESP32: “Я хочу отправить данные!”
  • Router: “Передаю запрос серверу!”
  • Server: “Получил! Обрабатываю! Сохраняю в базу!”
  • Database: “Данные сохранены в таблице sensors!”
  • Web interface: “Показываю новые данные пользователям!”

Блок 2: “Изучение школьных API endpoints - наша карта сокровищ” (15 минут)

🗺️ “API документация - путеводитель по серверу”

Демонстрация готовой документации:

📚 СПРАВОЧНИК API ШКОЛЬНОГО СЕРВЕРА:

🌐 Базовый адрес: http://192.168.1.100

📊 ДОСТУПНЫЕ ENDPOINTS:

1️⃣ /api/hello
   Метод: GET
   Описание: Проверка связи с сервером
   Ответ: {"status": "ok", "message": "Server is running"}

2️⃣ /api/sensor-data  
   Метод: POST
   Описание: Отправка данных от датчиков
   Формат: JSON
   Поля: device, student, class, sensor_type, value, timestamp

3️⃣ /api/students/{student_name}
   Метод: GET
   Описание: Получение данных конкретного ученика
   Пример: /api/students/ivan_petrov

4️⃣ /api/dashboard
   Метод: GET  
   Описание: Данные для главной панели
   Ответ: Список всех активных устройств

5️⃣ /api/class/{class_name}/data
   Метод: GET
   Описание: Все данные от класса
   Пример: /api/class/5a/data

🧪 “Тестирование API через браузер”

Практическое исследование endpoints:

🔬 ЛАБОРАТОРНАЯ РАБОТА "API EXPLORER":

Задание 1: Проверка связи
- Открываем браузер
- Переходим: http://192.168.1.100/api/hello
- Что видим: {"status": "ok", "message": "Server is running", "time": "15:18:46"}
- Вывод: Сервер работает! ✅

Задание 2: Просмотр данных
- Переходим: http://192.168.1.100/api/dashboard  
- Видим JSON со списком устройств
- Записываем количество активных устройств: ____

Задание 3: Поиск своих данных
- Переходим: http://192.168.1.100/api/class/5a/data
- Ищем данные от предыдущих уроков
- Есть ли данные с нашими именами: ДА/НЕТ

📝 “Формат JSON для отправки данных”

Создаем шаблон данных:

📋 ШАБЛОН JSON ДЛЯ НАШИХ ДАННЫХ:

{
  "device": "ESP32_5А_[номер_команды]",
  "student": "[Имя и Фамилия]", 
  "class": "5А",
  "sensor_type": "temperature",
  "value": 23.5,
  "unit": "°C",
  "timestamp": "2025-05-27T15:18:46",
  "location": "Кабинет информатики",
  "notes": "Измерение во время урока 10"
}

🎯 ПРИМЕР ЗАПОЛНЕНИЯ КОМАНДОЙ:
{
  "device": "ESP32_5А_Команда3", 
  "student": "Мария Сидорова",
  "class": "5А",
  "sensor_type": "temperature", 
  "value": 24.2,
  "unit": "°C",
  "timestamp": "2025-05-27T15:18:46",
  "location": "Кабинет информатики",
  "notes": "Тестовые данные от команды №3"
}

🔧 “Инструменты для тестирования API”

Знакомство с отладочными средствами:

🛠️ ИНСТРУМЕНТЫ API РАЗРАБОТЧИКА:

1️⃣ БРАУЗЕР (простейший способ):
- Только GET запросы
- Удобно для просмотра данных
- Не подходит для POST запросов

2️⃣ POSTMAN (профессиональный инструмент):
- Любые типы запросов  
- Красивый интерфейс
- Сохранение коллекций запросов

3️⃣ CURL (командная строка):
- Быстрый и мощный
- Подходит для автоматизации
- Требует знания синтаксиса

4️⃣ ARDUINO SERIAL MONITOR:
- Видим что отправляет ESP32
- Отладка в реальном времени
- Простой и доступный

🎯 МЫ БУДЕМ ИСПОЛЬЗОВАТЬ:
- Браузер для GET запросов
- Arduino Serial Monitor для отладки
- ESP32 для POST запросов

Блок 3: “Программирование отправки данных - делаем ESP32 говорящим” (18 минут)

💻 “Базовая программа отправки данных”

Пошаговое создание кода:

// 📡 ПРОГРАММА ОТПРАВКИ ДАННЫХ НА ШКОЛЬНЫЙ СЕРВЕР
// Урок 10: Client-Server взаимодействие

#include <WiFi.h>
#include <HTTPClient.h>
#include <ArduinoJson.h>

// 🔐 Настройки WiFi (из предыдущего урока)
const char* ssid = "School_IoT_2025";
const char* password = "ваш_пароль";

// 🌐 Настройки сервера
const char* serverURL = "http://192.168.1.100/api/sensor-data";

// 👤 ПЕРСОНАЛЬНЫЕ ДАННЫЕ (заполняет каждая команда)
String deviceName = "ESP32_5А_Команда1";      // Уникальное имя устройства
String studentName = "Иван Петров";           // Имя ученика
String className = "5А";                       // Класс

// 📊 Переменные для данных
float temperature = 0.0;
int sendInterval = 30000;  // Отправляем каждые 30 секунд
unsigned long lastSendTime = 0;

void setup() {
  Serial.begin(9600);
  Serial.println("🚀 Запуск IoT репортера");
  
  // 📶 Подключаемся к WiFi
  connectToWiFi();
  
  // 🌡️ Настраиваем "датчик температуры" (симуляция)
  randomSeed(analogRead(0));
  
  Serial.println("✅ Система готова к отправке данных!");
  Serial.printf("📡 Данные будут отправляться каждые %d секунд\n", sendInterval/1000);
}

void loop() {
  // 🕐 Проверяем, пора ли отправлять данные
  if (millis() - lastSendTime >= sendInterval) {
    
    // 🌡️ "Измеряем" температуру (симуляция)
    temperature = 20.0 + random(-50, 150) / 10.0;  // 15-27°C
    
    // 📤 Отправляем данные на сервер
    sendSensorData();
    
    lastSendTime = millis();
  }
  
  // 🔍 Проверяем состояние WiFi
  if (WiFi.status() != WL_CONNECTED) {
    Serial.println("⚠️ WiFi отключен, переподключаемся...");
    connectToWiFi();
  }
  
  delay(1000);  // Небольшая пауза
}

// 📡 Функция отправки данных
void sendSensorData() {
  if (WiFi.status() == WL_CONNECTED) {
    HTTPClient http;
    
    // 🌐 Настраиваем HTTP клиент
    http.begin(serverURL);
    http.addHeader("Content-Type", "application/json");
    
    // 📝 Формируем JSON данные
    String jsonData = createSensorJSON();
    
    Serial.println("📤 Отправляем данные:");
    Serial.println(jsonData);
    
    // 🚀 Отправляем POST запрос
    int responseCode = http.POST(jsonData);
    
    // 📨 Обрабатываем ответ
    handleServerResponse(responseCode, http.getString());
    
    http.end();
  } else {
    Serial.println("❌ WiFi не подключен, данные не отправлены");
  }
}

// 📋 Функция создания JSON
String createSensorJSON() {
  // 🕐 Получаем текущее время
  String timestamp = getCurrentTimestamp();
  
  // 📊 Формируем JSON строку
  String json = "{";
  json += "\"device\":\"" + deviceName + "\",";
  json += "\"student\":\"" + studentName + "\","; 
  json += "\"class\":\"" + className + "\",";
  json += "\"sensor_type\":\"temperature\",";
  json += "\"value\":" + String(temperature, 1) + ",";
  json += "\"unit\":\"°C\",";
  json += "\"timestamp\":\"" + timestamp + "\",";
  json += "\"location\":\"Кабинет информатики\",";
  json += "\"notes\":\"Урок 10 - Отправка данных\"";
  json += "}";
  
  return json;
}

// 🕐 Функция получения времени
String getCurrentTimestamp() {
  // Упрощенный формат времени (в реальности используем NTP)
  unsigned long uptime = millis() / 1000;
  int hours = (uptime / 3600) % 24;
  int minutes = (uptime / 60) % 60; 
  int seconds = uptime % 60;
  
  String timestamp = "2025-05-27T";
  if (hours < 10) timestamp += "0";
  timestamp += String(hours) + ":";
  if (minutes < 10) timestamp += "0"; 
  timestamp += String(minutes) + ":";
  if (seconds < 10) timestamp += "0";
  timestamp += String(seconds);
  
  return timestamp;
}

// 📨 Функция обработки ответа сервера
void handleServerResponse(int responseCode, String response) {
  Serial.printf("📊 Код ответа: %d\n", responseCode);
  
  if (responseCode == 200) {
    Serial.println("✅ Данные успешно отправлены!");
    Serial.println("📨 Ответ сервера: " + response);
  } else if (responseCode == 400) {
    Serial.println("❌ Ошибка 400: Неправильный формат данных");
  } else if (responseCode == 500) {
    Serial.println("❌ Ошибка 500: Проблема на сервере");
  } else {
    Serial.printf("⚠️ Неизвестная ошибка: %d\n", responseCode);
  }
  
  Serial.println("─────────────────────────");
}

// 📶 Функция подключения к WiFi (из предыдущего урока)
void connectToWiFi() {
  WiFi.begin(ssid, password);
  Serial.print("🔍 Подключение к WiFi");
  
  int attempts = 0;
  while (WiFi.status() != WL_CONNECTED && attempts < 20) {
    delay(1000);
    Serial.print(".");
    attempts++;
  }
  
  if (WiFi.status() == WL_CONNECTED) {
    Serial.println("\n✅ WiFi подключен!");
    Serial.printf("📍 IP адрес: %s\n", WiFi.localIP().toString().c_str());
  } else {
    Serial.println("\n❌ Не удалось подключиться к WiFi");
  }
}

🎯 “Персонализация кода каждой командой”

Задание для команд:

✏️ ПЕРСОНАЛИЗАЦИЯ ВАШЕГО IoT РЕПОРТЕРА:

1️⃣ ИЗМЕНИТЕ ЛИЧНЫЕ ДАННЫЕ:
String deviceName = "ESP32_5А_Команда[номер]";
String studentName = "[Ваше имя и фамилия]";  
String className = "5А";

2️⃣ ДОБАВЬТЕ УНИКАЛЬНОЕ СООБЩЕНИЕ:
"notes": "Привет от команды [номер]! Изучаем IoT!"

3️⃣ НАСТРОЙТЕ ИНТЕРВАЛ ОТПРАВКИ:
int sendInterval = 30000;  // 30 сек (можно 15000 или 60000)

4️⃣ ДОБАВЬТЕ ДИАПАЗОН "ИЗМЕРЕНИЙ":
temperature = 20.0 + random(-30, 70) / 10.0;  // 17-27°C

🎯 ЦЕЛЬ: Сделать ваше устройство уникальным!

🔍 “Отладка и диагностика”

Алгоритм поиска проблем:

🚨 ДИАГНОСТИКА ОТПРАВКИ ДАННЫХ:

1️⃣ ПРОВЕРКА СЕТИ:
✅ WiFi подключен? (статус WL_CONNECTED)
✅ IP адрес получен?
✅ Ping сервера проходит?

2️⃣ ПРОВЕРКА ДАННЫХ:
✅ JSON формируется корректно?
✅ Все поля заполнены?
✅ Нет лишних символов в строках?

3️⃣ ПРОВЕРКА ОТВЕТА:
📊 Код 200: Все отлично!
📊 Код 400: Проблема с форматом JSON
📊 Код 404: Неправильный URL
📊 Код 500: Проблема на сервере

4️⃣ ЧАСТЫЕ ОШИБКИ:
❌ Забыли кавычки в JSON
❌ Лишняя запятая в конце
❌ Неправильный URL сервера
❌ Слишком частые запросы

Блок 4: “Наблюдение за данными на дашборде - видим результат!” (10 минут)

💻 “Школьная панель мониторинга”

Демонстрация веб-интерфейса:

📊 ГЛАВНАЯ ПАНЕЛЬ: http://192.168.1.100/dashboard

┌─────────────────────────────────────────────┐
│ 🏫 ШКОЛЬНАЯ IoT СИСТЕМА                    │
│ Обновлено: 2025-05-27 15:18:46             │
├─────────────────────────────────────────────┤
│ 📈 АКТИВНЫЕ УСТРОЙСТВА: 8                  │
│                                             │
│ 🤖 ESP32_5А_Команда1 | Иван Петров        │
│    📊 Температура: 23.5°C | 15:17:30       │
│                                             │
│ 🤖 ESP32_5А_Команда2 | Мария Сидорова     │
│    📊 Температура: 24.1°C | 15:18:15       │
│                                             │
│ 🤖 ESP32_5А_Команда3 | Петр Иванов        │
│    📊 Температура: 22.8°C | 15:18:45       │
├─────────────────────────────────────────────┤
│ 📈 [График температуры за последний час]   │
│ 🎛️ [Кнопки управления устройствами]        │
└─────────────────────────────────────────────┘

👤 “Персональные страницы учеников”

Создание индивидуальных профилей:

🏠 ПЕРСОНАЛЬНАЯ СТРАНИЦА:
http://192.168.1.100/students/ivan_petrov

┌─────────────────────────────────────────────┐
│ 👤 ПРОФИЛЬ IoT УСТРОЙСТВА                  │
│ Ученик: Иван Петров                         │
│ Класс: 5А                                   │ 
│ Устройство: ESP32_5А_Команда1              │
├─────────────────────────────────────────────┤
│ 📊 ПОСЛЕДНИЕ ДАННЫЕ:                       │
│ 🌡️ Температура: 23.5°C                     │
│ 🕐 Время: 15:18:46                          │
│ 📍 Место: Кабинет информатики               │
├─────────────────────────────────────────────┤
│ 📈 ИСТОРИЯ ДАННЫХ:                         │
│ 15:18:46 - 23.5°C                          │
│ 15:18:16 - 23.2°C                          │
│ 15:17:46 - 23.8°C                          │
│ 15:17:16 - 23.1°C                          │
├─────────────────────────────────────────────┤
│ 📊 СТАТИСТИКА:                             │
│ Всего измерений: 24                         │
│ Средняя температура: 23.4°C                │
│ Мин/Макс: 22.1°C / 24.8°C                  │
│ Время работы: 12 минут                      │
└─────────────────────────────────────────────┘

📊 “Живые графики и аналитика”

Интерактивные элементы дашборда:

📈 ВОЗМОЖНОСТИ ВЕБ-ИНТЕРФЕЙСА:

🔴 РЕАЛЬНОЕ ВРЕМЯ:
- Данные обновляются каждые 10 секунд
- График "растет" на глазах
- Счетчики активных устройств

🎨 ИНТЕРАКТИВНОСТЬ:
- Клик на устройство → подробная информация
- Hover на графике → точные значения
- Фильтры по времени и классам

📊 АНАЛИТИКА:
- Средние значения по классу
- Сравнение между командами  
- Тренды изменения данных
- Экспорт данных в CSV

🎛️ УПРАВЛЕНИЕ:
- Кнопки включения/выключения светодиодов
- Изменение интервалов измерений
- Калибровка датчиков

🎯 “Проверка своих данных”

Практическое задание для команд:

🔍 НАЙДИТЕ СВОИ ДАННЫЕ НА ДАШБОРДЕ:

Шаг 1: Запустите программу на ESP32
Шаг 2: Дождитесь отправки первых данных
Шаг 3: Откройте http://192.168.1.100/dashboard
Шаг 4: Найдите свое устройство в списке

📋 ЗАПОЛНИТЕ КАРТОЧКУ:
┌─────────────────────────────────────┐
│ 🎯 МОИ ДАННЫЕ НА СЕРВЕРЕ           │
├─────────────────────────────────────┤
│ Имя устройства: ___________         │
│ Последнее значение: ____°C          │
│ Время последнего обновления: ___    │
│ Количество отправленных данных: __  │
│ Ссылка на мою страницу: ___         │
│                                     │
│ ✅ Данные отправляются регулярно    │
│ ✅ График обновляется               │
│ ✅ Нет ошибок в Serial Monitor      │
└─────────────────────────────────────┘

🎨 Творческое задание: “Цифровой дневник IoT репортера” (8 минут)

📰 “Создание профессионального профиля”

Каждая команда создает расширенную карточку:

🆔 ПРОФИЛЬ IoT РЕПОРТЕРА
Команда: _________________ Дата: 2025-05-27

📰 ЖУРНАЛИСТСКИЕ ДАННЫЕ:
Имя репортера: _________________________
Позывной устройства: ESP32_5А_Команда___
Специализация: Температурные сводки
Территория покрытия: Кабинет информатики

📡 ТЕХНИЧЕСКИЕ ХАРАКТЕРИСТИКИ:
API endpoint: /api/sensor-data
Формат данных: JSON
Частота отчетов: каждые ___ секунд
Точность измерений: ±0.1°C

📊 СТАТИСТИКА РАБОТЫ:
Отчетов отправлено сегодня: ____
Успешных передач: ____%
Средняя температура: ____°C
Самое интересное измерение: ________

🌐 СЕТЕВАЯ АКТИВНОСТЬ:
IP адрес: 192.168.1.___
Время в сети: ___ минут
Качество связи: Отличное/Хорошее/Плохое
Ошибок подключения: ____

🎯 УНИКАЛЬНЫЕ ОСОБЕННОСТИ:
Что особенного в наших данных: __________
_______________________________________

Секретное сообщение в JSON: ____________
_______________________________________

🏆 ДОСТИЖЕНИЯ:
□ Первый успешный POST запрос
□ Данные появились на дашборде  
□ Создана персональная страница
□ Работает стабильно >10 минут
□ Помог товарищу с настройкой

📈 ПЛАНЫ НА БУДУЩЕЕ:
Хотим добавить датчик: ________________
Хотим измерять: ______________________
Хотим научиться: ____________________

🖊️ Подпись главного репортера: __________

📱 QR-код ссылки на мою страницу:
[Место для QR-кода]

🎪 “Пресс-конференция IoT репортеров”

Презентация результатов:

  • Каждая команда представляет своего “цифрового репортера” (2 минуты)
  • Демонстрирует данные на дашборде
  • Показывает свою персональную страницу
  • Рассказывает о самых интересных измерениях
  • Отвечает на вопросы от “коллег-журналистов”

📝 Рефлексия и закрепление (5 минут)

📡 “API викторина”

Быстрые вопросы с практическими ответами:

❓ ПОКАЖИ ЖЕСТАМИ:
1. Как работает POST запрос? (руки к себе = получение, от себя = отправка)
2. Что делает JSON? (руки складывают "коробочку" = упаковка данных)
3. Где живут ваши данные? (показать на сервер/компьютер)
4. Как часто отправляете данные? (показать пальцами количество секунд)

📊 “Шкала готовности к API разработке”

🎚️ УРОВЕНЬ ПОНИМАНИЯ API:

🏆 API Архитектор (100%):
"Понимаю Client-Server, пишу JSON, анализирую ответы сервера"

🥇 API Разработчик (75%):
"Отправляю данные через POST, читаю API документацию"

🥈 API Пользователь (50%):
"Понимаю GET/POST, вижу свои данные на дашборде"

🥉 API Новичок (25%):
"Знаю что такое сервер и JSON"

Поднимите руку на уровне вашей готовности!

💭 “Одной фразой об API”

Каждый ученик завершает фразу:

  • “API для меня теперь это…”
  • “Самое крутое в отправке данных…”
  • “JSON похож на…”
  • “Мой ESP32 теперь умеет…”

🏠 Домашнее задание

📊 “Домашний мониторинг данных”

Основное задание:

  1. Наблюдение за своими данными

    • Проверять свою персональную страницу дома
    • Записывать интересные изменения в данных
    • Анализировать графики и тренды
  2. Эксперименты с кодом

    • Изменить интервал отправки данных
    • Добавить новое поле в JSON (например, “mood”: “отличное”)
    • Попробовать отправить данные о других “измерениях”
  3. Дневник API разработчика

📔 МОЙ ДНЕВНИК API РАЗРАБОТЧИКА - УРОК 10

📡 ГЛАВНЫЕ ОТКРЫТИЯ:
- Client-Server это: _________________________
- POST запрос отличается от GET тем: _________
- JSON используется для: ____________________

📊 МОИ ПЕРВЫЕ ДАННЫЕ:
Сколько отправил сообщений: ____
Средняя температура: ____°C
Самое необычное значение: ____°C
Код ошибки, который видел: ____

🌐 МОЯ ПЕРСОНАЛЬНАЯ СТРАНИЦА:
URL: http://192.168.1.100/students/________
Что мне нравится в дизайне: _______________
Что бы хотел добавить: ___________________

💻 ПРОГРАММИРОВАНИЕ:
Самая сложная часть кода: _________________
Что понял про JSON: ______________________
Где применю эти знания: __________________

🏠 ДОМАШНИЕ НАБЛЮДЕНИЯ:
Какие API использую дома: _________________
Где еще видел формат JSON: _______________
Идеи для домашнего IoT: __________________

🔬 Исследовательское задание (для увлеченных):

  • Изучить другие HTTP методы (PUT, DELETE, PATCH)
  • Найти примеры публичных API (погода, новости)
  • Исследовать формат XML как альтернативу JSON

🎨 Творческое задание:

  • Нарисовать схему путешествия данных от ESP32 до веб-страницы
  • Создать комикс “Приключения JSON пакета в интернете”

📊 Критерии оценивания

“Отлично” (5):

  • Понимает архитектуру Client-Server и роли компонентов
  • Уверенно программирует отправку данных через HTTP POST
  • Правильно формирует JSON структуры данных
  • Может анализировать ответы сервера и диагностировать ошибки
  • Успешно создает персональную страницу с данными
  • Демонстрирует творческий подход к персонализации данных

“Хорошо” (4):

  • Понимает основы HTTP протокола и API
  • Отправляет данные на сервер по готовому шаблону
  • Может модифицировать JSON структуру
  • Находит свои данные на дашборде
  • Понимает основные коды ответов HTTP

“Удовлетворительно” (3):

  • Имеет общее представление о Client-Server архитектуре
  • С помощью настраивает отправку данных
  • Использует готовые JSON шаблоны
  • Участвует в групповом обсуждении результатов

🛠️ Материалы и оборудование

Серверная инфраструктура:

  • Raspberry Pi с настроенным API сервером
  • База данных для хранения данных датчиков
  • Веб-интерфейс с персональными страницами
  • Система логирования API запросов

Для каждой команды:

  • ESP32 DevKit плата с WiFi подключением
  • Готовый код шаблон для отправки данных
  • Доступ к API документации
  • Индивидуальные учетные данные

Программное обеспечение:

  • Arduino IDE с библиотеками HTTPClient и ArduinoJson
  • Веб-браузер для мониторинга дашборда
  • Доступ к Serial Monitor для отладки

API Сервер (Raspberry Pi):

# Пример API endpoint на Flask
@app.route('/api/sensor-data', methods=['POST'])
def receive_sensor_data():
    data = request.get_json()
    
    # Валидация данных
    required_fields = ['device', 'student', 'class', 'sensor_type', 'value']
    if not all(field in data for field in required_fields):
        return jsonify({'error': 'Missing required fields'}), 400
    
    # Сохранение в базу данных
    db.execute('''INSERT INTO sensor_data 
                  (device, student, class, sensor_type, value, timestamp)
                  VALUES (?, ?, ?, ?, ?, ?)''', 
               (data['device'], data['student'], data['class'], 
                data['sensor_type'], data['value'], datetime.now()))
    
    return jsonify({'status': 'success', 'message': 'Data received'}), 200

🔍 Методические заметки для учителя

Подготовка к уроку:

  1. Настройка сервера: Убедиться, что все API endpoints работают корректно
  2. База данных: Очистить тестовые данные, подготовить структуру таблиц
  3. Сетевая инфраструктура: Проверить стабильность WiFi подключения
  4. Персонализация: Подготовить уникальные идентификаторы для каждой команды

Возможные сложности:

Проблема: Неправильный формат JSON приводит к ошибкам 400 Решение: Подготовить валидатор JSON, показать типичные ошибки

Проблема: Перегрузка сервера при одновременной отправке от всех ESP32 Решение: Настроить разные интервалы отправки для команд, использовать очереди

Проблема: Сложность понимания HTTP кодов ответов Решение: Создать простую таблицу соответствия кодов и их значений

Безопасность и мониторинг:

  • Логирование всех API запросов для анализа активности
  • Ограничение частоты запросов от одного устройства
  • Фильтрация входящих данных от SQL инъекций
  • Мониторинг производительности сервера

Дифференциация обучения:

  • Для продвинутых: изучение дополнительных HTTP заголовков, аутентификация API
  • Для начинающих: фокус на базовой отправке данных, готовые JSON шаблоны
  • Для визуалов: диаграммы Client-Server взаимодействия, схемы API архитектуры
  • Для практиков: больше времени на эксперименты с кодом и отладку

Расширение урока:

  • Добавление аутентификации API (API ключи)
  • Изучение WebSocket для real-time коммуникации
  • Интеграция с внешними API (погода, время)
  • Создание мобильного приложения для мониторинга