我手头有一个谜,希望能帮我调试一下。
我有这个脚本:
//------------ Server sent event stream for sensor events----------------
var evtSource = new EventSource("event_manager.php");
evtSource.onmessage = function(e)
{
var newElement = document.createElement("li");
console.log(e.data);
newElement.innerHTML = e.data;
eventList.appendChild(newElement);
//------------ Splits received event data for further use ----------------
var split_data = e.data.split(" ");
if (split_data[3] == "Potentiometer")
{
document.getElementById("livingRoomTemp").innerHTML = split_data[4] + "°";
}
//------------ Keeps event list scrolled to the latest event ----------------
var objDiv = document.getElementById("eventBar");
objDiv.scrollTo(0, objDiv.scrollHeight);
}
这打开了一个带有以下PHP文件的事件流:
<?php
header("Content-Type: text/event-stream'n'n");
require("../includes/config.php");
while (1) {
$rows = query("SELECT * FROM `event_log` WHERE `displayed` = 0");
foreach ($rows as $event)
{
echo "time:" . $event["time"] . "controller:" . $event["controller"] . "sensor:" .$event["sensor"] . "data:" .$event["data"] . " " ."'n'n";
query("UPDATE `event_log` SET `displayed` = 1 WHERE `id` = ?", $event["id"]);
}
ob_end_flush();
flush();
sleep(1);
}
?>
所有这些以前都运行得很好,据我所知,我没有更改任何一部分,但由于某种原因,我的.onmessage
函数不再执行。
我可以卷曲到事件流PHP文件中,观察它按预期工作,将echo
发送到我的终端,但无论出于什么原因,浏览器都什么都不做。您在那里看到的query
函数只是向MySQL发送一个SQL查询。SSE显然正在运行,因为查询函数对MySQL表具有预期效果。我在浏览器(Iceweeel)的网络日志中没有看到任何错误,也没有像我预期的那样记录到控制台。我甚至可以看到网络日志以我指定的间隔更新SSE。它把我逼疯了。
我不知道该怎么解决(牢不可破)这个问题,非常感谢你的帮助。
额外信息:
树莓派2 上的LAMP服务器
树莓(杰西,我想。不管怎样,最新的)
浏览器:冰鼬(萤火虫)
Pi既是DIY家庭自动化系统的UI又是服务器,该系统与Arduino微控制器(目前只有一个)通信,这些微控制器也被设置为控制灯光、读取传感器等的服务器。来自arduino的数据被发送到MySQL数据库,上面的SSE轮询该数据库,看看UI中是否显示了最新的读数,如果没有,则将其发送到浏览器并在发送时更新。
这是我在这个项目中设置的第一件事,直到今天早些时候都在按预期工作。如果我遗漏了任何重要数据,请告诉我,我会立即纠正。
解决了它。
将网站压缩为一个div、脚本和PHP文件,问题仍然存在。
原来这就是罪魁祸首:
echo "time:" . $event["time"]...
响应的第一部分需要以开头
echo "data:" . $event["time"]...
为什么?我不确定。我需要更多地了解SSE。
无论如何,这里问题的根源是编码不小心。我做了一个改变,期待着另一个功能,但之后没有检查它是否仍然有效。然后我转移了注意力,忘记了我所做的改变。我没有保留整个项目的备份,这使情况更加复杂。