Я пытаюсь создать веб-сервер с ESP32 и отобразить данные из ESP на странице HTML. Основные проблемы заключаются в том, что я не теряю пакетов, но отображается только секунды за секундами, а не быстрее.
Я пробовал несколько вещей:
использовать WebSocketServer (он увеличивает скорость на полсекунды, но не быстрее)
попробовал WiFiServer и использовал client.print для печати веб-страницы (тоже не быстрее)
#include <WiFi.h>
#include <WiFiClient.h>
#include <WebServer.h>
#include <WebSocketsServer.h>
#include <WebSocketsClient.h>
#include <Ticker.h>
//Enter your SSID and PASSWORD
const char* ssid = "HUAWEI P20 lite";
const char* password = "########";
WebServer server(80);
WebSocketsServer webSocket = WebSocketsServer(81);
Ticker timer;
char webpage[] PROGMEM = R"=====(
<html>
<head>
<script src='https://cdn.jsdelivr.net/npm/chart.js@2.8.0'></script>
</head>
<body onload="javascript:init()">
<div>
<canvas id="line-chart" width="800" height="450"></canvas>
</div>
<script>
var webSocket, dataPlot;
var maxDataPoints = 50;
function removeData(){
dataPlot.data.labels.splice(0,1);
dataPlot.data.datasets[0].data.splice(0,1);
}
function addData(label, data) {
if (dataPlot.data.labels.length > maxDataPoints) {
removeData();
}
dataPlot.data.labels.push(label);
dataPlot.data.datasets[0].data.push(data);
dataPlot.update();
}
function init(){
webSocket = new WebSocket('ws://' + window.location.hostname + ':81/');
dataPlot = new Chart(document.getElementById("line-chart"), {
type: 'line',
data:{
labels: [],
datasets: [{
data: [],
label: "RandomInt",
borderColor: "3e95cd",
fill: false
}]
}
});
webSocket.onmessage = function(event){
var data = JSON.parse(event.data);
var today = new Date();
var t = today.getHours() + ":" + today.getMinutes() + ":" + today.getSeconds();
addData(t,data.value);
}
}
</script>
</body>
</html>
)=====";
//------------------------------------------------------------------
// SETUP
//------------------------------------------------------------------
void setup() {
Serial.begin(115200);
//------------------------------------------------------------------
//ESP32 connects to your wifi
WiFi.mode(WIFI_STA); //Connect to your wifi
WiFi.begin(ssid, password);
Serial.println("Connecting to ");
Serial.print(ssid);
//Wait for WiFi to connect
while(WiFi.waitForConnectResult() != WL_CONNECTED){
Serial.print(".");
}
//If connection successful show IP address in serial monitor
Serial.println("");
Serial.print("Connected to ");
Serial.println(ssid);
Serial.print("IP address: ");
Serial.println(WiFi.localIP()); //IP address assigned to your ESP
//------------------------------------------------------------------
server.on("/",[](){
server.send_P(200,"text/html", webpage);
});
Serial.println("Server Ready");
server.begin();
webSocket.begin();
webSocket.onEvent(webSocketEvent);
timer.attach(0.1,getData);
}
void loop() {
webSocket.loop();
server.handleClient();
}
//------------------------------------------------------------------
// SETUP FUNCTION
//------------------------------------------------------------------
void getData(){
int a = random(255);
Serial.println(String(a));
String json = "{\"value\":";
json+= a;
json+= "}";
webSocket.broadcastTXT(json.c_str(), json.length());
}
void webSocketEvent ( uint8_t num, WStype_t type, uint8_t* payload, size_t length){
#Do something, we'll see later
}