Crud в реальном времени SSE? - PullRequest
Новая
       81

Crud в реальном времени SSE?

0 голосов
/ 13 июля 2020

Могу ли я выполнить crud с SSE в реальном времени, когда пользователь добавляет что-то в базу данных или обновляет, чтобы показать всем подключенным пользователям, я хочу знать, могу ли я сделать это, используя php или i go с javascript, потому что я хочу создать панель администратора, где администратор добавляет сообщение в блог, и если пользователи находятся в блоге, чтобы отображать их в режиме реального времени. Спасибо! 

var source = new EventSource("real.php");
    source.onmessage = function(event) {
        var jdata = JSON.parse(event.data);
        console.log(jdata);
        document.getElementById("result").innerHTML += jdata.firstName + "<br>";
    };

Это мое тестирование js, а это php: 

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

$data = array(
'firstName'=>'Test',
'lastName'=>'Last'
 );
 $str = json_encode($data);
 echo "data: {$str}\n\n";
 flush();
 ?>

Прямо сейчас этот пример просто добавляет к #result html снова и снова, я хочу определять, когда в базе данных появляется что-то новое, а затем добавлять в html новое добавление в реальном времени.

1 Ответ

0 голосов
/ 13 июля 2020

Конечно,

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

Минимальный пример (вымышленные данные) - хранится в таблице (например, event_log): 

[
    'timestamp' => 1,
    'table' => 'user'
    'id' => '99',
    'action' => 'create'
    'data' => [...]
],[
    'timestamp' => 1234,
    'table' => 'posts',
    ...
]

Теперь каждый раз вызывается ваш real.php, вы запрашиваете у своего event_log записи, которые новее, чем при последней проверке. Для этого ваш php -скрипт будет выглядеть так: 

<?php
// disable buffering to receive output immediately
ini_set('output_buffering','off'); 

header("Content-Type: text/event-stream");
$lastChecked = time(); // save current timestamp

while (true) // runs until connection gets terminated
{
    // query event_log where time > $lastChecked
    // echo accoring to link provided
   
    // reset lastChecked
    $lastChecked = time();

    // wait 1 second before checking event_log again
    sleep(1);
}

https://developer.mozilla.org/en-US/docs/Web/API/Server-sent_events/Using_server-sent_events#Fields

Пример SSE: https://github.com/mdn/dom-examples/blob/master/server-sent-events/sse.php

После того, как вы получили событие через onmessage, вам нужно будет использовать JS для добавления / редактирования или удаления элементов DOM, чтобы сделать эти изменения видимыми для пользователя.

Вы можете использовать обработчики событий c: https://developer.mozilla.org/en-US/docs/Web/API/Server-sent_events/Using_server-sent_events#Named_events

в JS: 

source.addEventListener('<your_event_name>', function(event) { /** event.data ... */ })
...