ESP8266 同时请求多个 HTTP GET
ESP8266 request multiple HTTP GET simultaneously
我用 ESP8266 开始了我的第一个项目。
这是一个显示网络服务器上数据的温度监视器。
因为我不想手动刷新页面来获取新数据,所以我使用 HTTP 请求来显示它。
我要发送 3 个不同的请求,一个是当前温度,一个是最高温度,一个是最低温度。
我面临的问题是,尽管我同时发送了所有这些数据,但数据不会同时刷新。
这是发送请求的代码:
<script>
function getCurrent() {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("current").innerHTML =
this.responseText;
}
};
xhttp.open("GET", "readCurrent", true);
xhttp.send();
}
function getHigh() {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("high").innerHTML =
this.responseText;
}
};
xhttp.open("GET", "readHigh", true);
xhttp.send();
}
function getLow() {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("low").innerHTML =
this.responseText;
}
};
xhttp.open("GET", "readLow", true);
xhttp.send();
}
setInterval(function() {
getHigh();
getLow();
getCurrent();
}, 2000);
</script>
这就是处理它们的代码:
float temp;
float hoechst;
float tiefst;
void handleRoot() {
String s = MAIN_page; //Read HTML contents
server.send(200, "text/html", s); //Send web page
}
void handleCurrent() {
float t = temp;
server.send(200, "text/plane", String(t));
}
void handleHigh() {
float high = hoechst;
server.send(200, "text/plane", String(high));
}
void handleLow() {
float low = tiefst;
server.send(200, "text/plane", String(low));
}
void setup() {
[...]
server.on("/", handleRoot);
server.on("/readCurrent", handleCurrent);
server.on("/readHigh", handleHigh);
server.on("/readLow", handleLow);
[...]
}
循环只是用这个函数更新温度:
void updateTemperatures() {
sensor.requestTemperatures();
yield();
float low = tiefst;
float high = hoechst;
float t = sensor.getTempCByIndex(0);
if(t < low) {
low = t;
} else if(t > high) {
high = t;
}
yield();
temp = t;
tiefst = low;
hoechst = high;
}
并处理客户 (server.handleClient())
所以我的问题是:如何同时更新数据,或者甚至可以使用 ESP8266 更新数据?
您可以通过 return 在一个请求中输入所有三个值来同时更新数据。
任何 Web 服务器都可以采用这种方式,更不用说 运行 在像 ESP8266 这样极其有限的处理器上了。
您可以使用如下代码同时 return 所有三个值:
void handleAll() {
String results_json = "{ \"temperature\": " + String(temp) + ",", +
"\"high\": " + String(hoechst) + "," +
"\"low\": " + String(tiefst) + " }";
server.send(200, "application/json", results_json);
}
这构成了一个 JSON 对象,其中包含所有三个值。 JSON 是 "JavaScript Object Notation" 并且 Javascript 很容易组合和拆开。
您还需要更新您的 ESP8266 网络服务器代码以添加
server.on("/readAll", handleAll);
通过此更改,您可以消除其他三个 /read 处理程序。
并且您需要更新 Javascript。您只需要在 Javascript 中进行一次调用,将 returned 文本转换为 Javascript 对象并从中读取三个值中的每一个以设置 [=] 中的元素34=]。这是 jQuery 对您来说非常简单的事情。
而且,它是 'text/plain'
,而不是 'text/plane'
。
您也可以查看 jQuery - 它会大大简化您的 Javascript 代码。
简单地说:你不能同时更新数据,因为只有一个 CPU 核心。此外,您应该在设计时考虑到经济性,您希望通过三个交易来获得一些数字......最简单的数据库形式之一是 CSV,或 "Comma-Separated Values";本质上:用逗号分隔的值。
知道你的温度在列表中的顺序(低、当前、高),你可以简单地创建一个新变量,或者在输出数据的语句中连接你的变量,即低“,”当前的 "," 高,那会 return 你像 -1.23455,23.53556,37.23432 这样的东西,你可以通过查找逗号并使用字符串运算符轻松地将其分成三个。
现在您可以从低规格设备的单笔交易中获取您的三个值!
祝你好运! :)
我用 ESP8266 开始了我的第一个项目。
这是一个显示网络服务器上数据的温度监视器。
因为我不想手动刷新页面来获取新数据,所以我使用 HTTP 请求来显示它。
我要发送 3 个不同的请求,一个是当前温度,一个是最高温度,一个是最低温度。
我面临的问题是,尽管我同时发送了所有这些数据,但数据不会同时刷新。
这是发送请求的代码:
<script>
function getCurrent() {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("current").innerHTML =
this.responseText;
}
};
xhttp.open("GET", "readCurrent", true);
xhttp.send();
}
function getHigh() {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("high").innerHTML =
this.responseText;
}
};
xhttp.open("GET", "readHigh", true);
xhttp.send();
}
function getLow() {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("low").innerHTML =
this.responseText;
}
};
xhttp.open("GET", "readLow", true);
xhttp.send();
}
setInterval(function() {
getHigh();
getLow();
getCurrent();
}, 2000);
</script>
这就是处理它们的代码:
float temp;
float hoechst;
float tiefst;
void handleRoot() {
String s = MAIN_page; //Read HTML contents
server.send(200, "text/html", s); //Send web page
}
void handleCurrent() {
float t = temp;
server.send(200, "text/plane", String(t));
}
void handleHigh() {
float high = hoechst;
server.send(200, "text/plane", String(high));
}
void handleLow() {
float low = tiefst;
server.send(200, "text/plane", String(low));
}
void setup() {
[...]
server.on("/", handleRoot);
server.on("/readCurrent", handleCurrent);
server.on("/readHigh", handleHigh);
server.on("/readLow", handleLow);
[...]
}
循环只是用这个函数更新温度:
void updateTemperatures() {
sensor.requestTemperatures();
yield();
float low = tiefst;
float high = hoechst;
float t = sensor.getTempCByIndex(0);
if(t < low) {
low = t;
} else if(t > high) {
high = t;
}
yield();
temp = t;
tiefst = low;
hoechst = high;
}
并处理客户 (server.handleClient())
所以我的问题是:如何同时更新数据,或者甚至可以使用 ESP8266 更新数据?
您可以通过 return 在一个请求中输入所有三个值来同时更新数据。
任何 Web 服务器都可以采用这种方式,更不用说 运行 在像 ESP8266 这样极其有限的处理器上了。
您可以使用如下代码同时 return 所有三个值:
void handleAll() {
String results_json = "{ \"temperature\": " + String(temp) + ",", +
"\"high\": " + String(hoechst) + "," +
"\"low\": " + String(tiefst) + " }";
server.send(200, "application/json", results_json);
}
这构成了一个 JSON 对象,其中包含所有三个值。 JSON 是 "JavaScript Object Notation" 并且 Javascript 很容易组合和拆开。
您还需要更新您的 ESP8266 网络服务器代码以添加
server.on("/readAll", handleAll);
通过此更改,您可以消除其他三个 /read 处理程序。
并且您需要更新 Javascript。您只需要在 Javascript 中进行一次调用,将 returned 文本转换为 Javascript 对象并从中读取三个值中的每一个以设置 [=] 中的元素34=]。这是 jQuery 对您来说非常简单的事情。
而且,它是 'text/plain'
,而不是 'text/plane'
。
您也可以查看 jQuery - 它会大大简化您的 Javascript 代码。
简单地说:你不能同时更新数据,因为只有一个 CPU 核心。此外,您应该在设计时考虑到经济性,您希望通过三个交易来获得一些数字......最简单的数据库形式之一是 CSV,或 "Comma-Separated Values";本质上:用逗号分隔的值。
知道你的温度在列表中的顺序(低、当前、高),你可以简单地创建一个新变量,或者在输出数据的语句中连接你的变量,即低“,”当前的 "," 高,那会 return 你像 -1.23455,23.53556,37.23432 这样的东西,你可以通过查找逗号并使用字符串运算符轻松地将其分成三个。
现在您可以从低规格设备的单笔交易中获取您的三个值!
祝你好运! :)