SSE (Server-Sent Events)? HTML5?? ??? ????? ????? ???? ?? ???? ??? ??????. ?? ??, ?? ? ?? ????? ??? ? HTTP ??? ?? ?? ?? ??? ?????. ?? ??? ? EventSource ????? ???? ???? ????. const eventSource = new EventSource ( '/stream'); eventSource.onMessage = function (event) {console.log ( '?? ??? :', event.data); }; ??? ??? ??? ???/??? ????? ???? ??? ?? ?? ??? : Content \ N \ n ??? ?? ???? ???????. ???? ?? ??? ??? ????. 1. ??? ??? ??? ???? ?? CORS ??; 2. ?? ? ??? ?????? ??? ?? ??; 3. ??? ?? : ??? ?? ??? ??? ?????. 4. ??? ??? ???? ?? ?? ?? ??? ??????. WebSocket? ??? ? SSE? ? ???? ???? ?? ???? ???? ?? HTTP ????? ????? ?? ?????? ???? ?? ?????. ?? ?? ???? ?? ??? ?? ????? ?????.

? ???? ???? ????? ??? ????? ?? ???? ?? HTML5? ??? ??? ? SEVERTENTENTENT ??? (SSE)? ?????. WebSocket? ??? ? ????? ? ???? ?? ?? ???? ?? ??? ?????? ?? ???? ????? ?????.

??? ?? ???? ??????

Server-Sent Events? HTML5? ??? ??? HTTP ? ??? ?? ???? ????? ?? ? ? ????. ??? ?? ??? ?? SSE? ??? ?? ? ??? ?? ??? ??? ???? ?? ??, ??? ?? ?? ?? ???? ?? ??? ???? ?? ? ????.

?? ???? EventSource ????? ???? ?? ?? URL? ???? ????.

 const eventSource = new EventSource ( '/stream');
eventsOURCE.ONMESSAGE = function (event) {
    Console.log ( '?? ? ??? :', event.data);
};

??? ???? ???? ??? ? ?????? ???? ???? ?? ? ? ????.

?? ??? SSE ??? ???? ??? ??????

?? ??? ???? ?? ??? ???? ?? ???? ?????. ??? ?? SSE ???? ???? ??????.

Node.js Express? ?? ?? ?????.

 app.get ( '/stream', (req, res) => {
    res.setheader ( 'content-type', 'text/event-stream');
    res.setheader ( 'Cache-Control', 'No-Cache');

    // ??? ??? ????? setInterVal (() => {
        res.write (`data : $ {new date ()} \ n \ n`);
    }, 1000);
});

?? ?? :

• ??? ?? ??, ?? text/event-stream ??????
• ??? ?? ?? ??? ????. ??? ?? ??
• ??? ??? data: 內容\n\n , ??? ? ?? Newlines? ???? ?? ?????.

Python (Flask), PHP ?? Java Spring Boot? ?? ?? ??? ???? ??? ? ????.

?? ?? ??? ??

1. ??? ?? ?? ??? ??? ???? ??? ??? ?? ??? ?? ?? ??, EventSource ??? ??? ????? CORS? ???????.

 ??? ??-??-??? : *

?? ?? ??? ??? ?????.

2. ?? ? ?? ???? ??? ???? ????? ???? ?? ????? ???? ?? ?? ??? 3 ????. ?? ? ??? ??? ?? ? ? ????.

 ? ?? : 5000

3. ??? ?? ??? ?? ?? onmessage ??? ?? ??? ??? ?? ? ?? ????.

 ??? : ????
??? : { "type": "News", "Content": "New News Is Coming"}}

??? ?? ???? :

 eventsOurce.addeventListener ( '????', function (event) {
    Console.log ( '???? ?? :', event.data);
});

4. ?? ?? ?? ? ??? ??? ??? ????? ???? ?????????. ??? ?????? ??? ?? ??? ??? ???? ??? ??? ??? ?? ??? ? ??? ???? ????? ??????.

WebSocket ?? SSE? ?? ????????

WebSocket? ? ???? ??? ??? ????? ???? ????. ??? ??????? ???? ?? ?? ? ???? ??? ?? ??? ???? ?? ?? SSE? ? ?? ?????.

??? ??? ????.

• ?? ????? ????? ?? ? ??? ?? ???? ????.
• ?? ? ??? ?????
• ?? HTTP ????? ???? ???? ?? ?? ? ? ????.

??? ?????.

• ???? ??????? ?? ?? ? ?????
• ???? ???? ?? ????? (?, ??? ??? Edge? ???? ????)

????? ?? ??. SSE? ????? ??? ?? ????? ?? ??, ?? ?? ? ?? ??????? ???????. ??? ??? ?? ???? ??? ??? SSE? ??? ???? ?????.

? ??? HTML5 Server-Sent Events (SSE)? ??? ???? ?????.? ?? ?????. ??? ??? PHP ??? ????? ?? ?? ??? ?????!