Можно ли отправить данные с сервера на страницу HTML, а затем обратно на сервер? - PullRequest
Новая
       18

Можно ли отправить данные с сервера на страницу HTML, а затем обратно на сервер?

1 голос
/ 25 июня 2019

Я пытаюсь сделать сканер сети WiFi, используя ESP32.Это основной пример, на котором я планирую построить: 

  server.on("/scan", HTTP_GET, [](AsyncWebServerRequest *request){
  String json = "[";
  int n = WiFi.scanComplete();
  if(n == -2){
    WiFi.scanNetworks(true);
  } else if(n){
    for (int i = 0; i < n; ++i){
      if(i) json += ",";
      json += "{";
      json += "\"rssi\":"+String(WiFi.RSSI(i));
      json += ",\"ssid\":\""+WiFi.SSID(i)+"\"";
      json += ",\"bssid\":\""+WiFi.BSSIDstr(i)+"\"";
      json += ",\"channel\":"+String(WiFi.channel(i));
      json += ",\"secure\":"+String(WiFi.encryptionType(i));
      json += "}";
    }
    WiFi.scanDelete();
    if(WiFi.scanComplete() == -2){
      WiFi.scanNetworks(true);
    }
  }
  json += "]";
  request->send(200, "application/json", json);
  json = String();
  });

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

Но после сканирования я могу поместить число найденных сетей в переменную: 

WiFi.scanNetworks(true);
int n = WiFi.scanComplete();

Но это работает в файле CPP.Не имеет ничего общего с сервером или HTML.

Однако я могу использовать PROGMEM для создания своей страницы.Я также могу использовать заполнители для замены некоторых переменных или строк.И я могу построить страницу, фрагментировав ее. 

String index_html PROGMEM = "<!DOCTYPE html><html> <head>";
index_html += "<meta charset=\"utf-8\">"
// etc

Вот как должен выглядеть обработчик сервера: 

  server.on("/IP-Config", HTTP_GET, [](AsyncWebServerRequest *request){
    String index_html PROGMEM = "";
    index_html += "";
    // ...
    index_html += "";
    request->send_P(200, "text/html", index_html.c_str());
  });

Моя проблема в том, что у меня есть только базовые знания JavaScript, jQueryи AJAX и я пошли в Интернет, чтобы найти, как создать неупорядоченный список, когда у вас нет количества элементов, и я нашел this : 

var str = '<ul class='xbreadcrumbs' style='position:absolute; bottom:0px'>';

for(var i in $yourArray){
   str += '<li><a href="#">String 1</a></li>';
}

str += '</ul>';

$('body').append(str);

Из краткого обзораЯ вижу, что этот способ генерации списка также объединяет строку в строку.

Ооо, у меня действительно кружится голова, когда я пытаюсь понять, как объединить все это в одну рабочую веб-страницу.

Как объединить так много строк, чтобы они имели смысл и действительно работали?

Не говоря уже о том, что я также думал об обновлении списка каждые 10 секунд, чтобы я мог видетьесли какая-либо сеть появилась или исчезла, как это делает смартфон.

...