10. Server Sent Events

Server Sent Events API

server sent events API는 웹 페이지가 서버로부터 갱신된 정보를 자동으로 받을 수 있도록 설정합니다.

 

server sent events 지원 여부 확인

server sent events를 사용하기 전에, 우선 사용자의 웹 브라우저가 이를 지원하는지 안 하는지 확인해야 합니다.

 

if (typeof(EventSource) !== "undefined") {

    // server sent events를 위한 코드 부분

} else {

    // server sent events를 지원하지 않는 브라우저를 위한 안내 부분

}

 

server sent events를 이용해 5초마다 웹 페이지를 갱신

if(typeof(EventSource) !== "undefined") {

    var source = new EventSource("/examples/media/sse.php");

    source.onmessage = function(event) { 

        document.getElementById("result").innerHTML += event.data + "<br>"; 

    };

}

 

사용한 서버 측 PHP 파일인 sse.php 파일

sse.php

<?php

header('Content-Type: text/event-stream');

header('Cache-Control: no-cache');

 

$time = date('r');

echo "data: The server time is: {$time}\n\n";

flush();

?>

 

출처 : tcpschool.com/