4

我正在尝试使用 EventSource 来创建一个 1 对 1 的实时连接聊天。我已经设置了我的事件源，并且从开发人员工具告诉我的内容来看，它是打开的并且可以工作，但是没有从 PHP 文件中显示响应数据。

PHP：

<?php
header('Content-Type: text/event-stream');
header('Cache-Control: no-cache');

session_start(); // Starting Session
include 'dbconnect.php';
include 'Session.php';

$messageuserid = $_GET['messageuserid'];

$RunSqlGM = "SELECT * FROM messages WHERE (SUsername = '$Session_Username' AND RUsername = '$messageuserid') OR (SUsername = '$messageuserid' AND RUsername = '$Session_Username')";
$getmessagethread = mysqli_query($con,$RunSqlGM)or die(mysqli_error());

while($MessageRows = mysqli_fetch_array($getmessagethread)) {
    $MSUsername = $MessageRows['SUsername'];
    $MRUsername = $MessageRows['RUsername'];
    $MSender = $MessageRows['Sender'];
    $MessageContent = $MessageRows['Message'];
    $TimeStamp = date("g:ia \o\\n l jS F Y", strtotime($MessageRows["Time"]));


    if ($MSender === $Session_Username) {
        echo "<table class='messagebubbleright'>";
            echo "<tr><th></th></tr>";
            echo "<tr>";
                echo "<td class='inforight'>$MSender<br>$TimeStamp</td>";
            echo "</tr>";
            echo "<tr>";
                echo "<td class='bubbleright'>$MessageContent</td>";
            echo "</tr>";
        echo "</table>";
        flush();
    } else {
        echo "<table class='messagebubbleleft'>";
            echo "<tr><th></th></tr>";
            echo "<tr>";
                echo "<td class='infoleft'>$MSender<br>$TimeStamp</td>";
            echo "</tr>";
            echo "<tr>";
                echo "<td class='bubbleleft'>$MessageContent</td>";
            echo "</tr>";
        echo "</table>";
        flush();
    }
}
mysqli_close($con); // Connection Closed
?>

调用事件源的js包含在该函数中，该函数通过单击按钮启动。

JS：

function GetMessages(GetMUserID) {
    if (typeof(EventSource) !== "undefined") {
        var source = new EventSource("db/getmessages.php?messageuserid=" + GetMUserID);
        source.addEventListener("open", function() {
            $("#readmessagearea").html("Getting server updates");
        });

        source.addEventListener("message", function(event) {
            $("#readmessagearea").html(event.data);
        });

    } else {
        $("#readmessagearea").html("Sorry, your browser does not support server-sent events...");
    }
}

任何帮助或指导将不胜感激。我对 SSE 比较陌生，但据我所知，这应该可行。

4

1 回答 1

2

您的 PHP 代码存在一些问题。一个容易修复的是最好flush()换成@ob_flush();@flush(). ob_flush()确保 PHP 没有缓冲任何内容，并且这些@标志只是确保如果没有使用缓冲，您不会收到警告消息。

第二个问题是 SSE 协议是最小的，但不是最小的！您需要在消息前面加上“data:”，并在后面加上“\n\n”。您的 HTML 不包含任何自己的换行符，所以我认为它会起作用。（除非有换行符$MessageContent或任何其他动态数据......我建议不仅对回车进行一些数据过滤，还对 HTML 标记进行一些数据过滤，因为您当前的代码容易受到嵌入式 HTML 攻击。）

另一种方法：另一种方法是仅发送一个 JSON 对象，其中包含$MessageRows["Time"]、$MSender、$MessageContent等，并让 JavaScript 客户端创建 HTML。这更灵活（例如，不同国家的客户可以拥有自己的日期戳格式，可以更改布局等，而无需触及后端），但会将更多工作转移到前端。

于 2017-01-18T09:41:08.633 回答