HTML 5-EventSourceサービス側プッシュイベント

イベントソースを初期化し、イベントを受け入れるURLを指定します.

var evtSource = new EventSource("/sendMessage");

メッセージの傍受:

//             
evtSource.onmessage = function (e) {
    console.log(e.data);
}
//             
evtSource.onopen = function () {
    console.log("Server open")
} 
//       
evtSource.onerror = function () {
    console.log("Error")
} 

 //     
evtSource.addEventListener("myEvent", function (e) {
    console.log(e.data);
}, false)

サーバ側nodejs実装:

ヘッダ「Content-Type」を「text/event-stream」

に設定

フィールド:各イベント間は空の行で区切られます.

フィールドは空白で、行がコメントであることを示し、処理時に無視されます.event:イベントを宣言する行のタイプを表します.ブラウザは、データを受信すると、対応するタイプのイベントを生成します.data:メッセージのデータフィールド.このメッセージに複数のdataフィールドが含まれている場合、クライアントは改行でフィールド値として文字列に接続します.id:イベントIDは、現在のEventSourceオブジェクトの内部属性「最後のイベントID」の属性値となります.retry:再接続の時間(ミリ秒単位)を指定する整数値で、フィールドの値が整数でない場合は無視されます.

var http = require('http');
var fs = require('fs');

http.createServer(function (req, res) {
    if(req.url === '/sendMessage') {
        res.writeHead(200, {
            "Content-Type": "text/event-stream" //     
        });

        setInterval(function () {
            res.write(
                //   
                "data:" + new Date().toLocaleTimeString() + "

" + //  “

”  
                //   
                ": '    ！'" + "
" +
                "event: myEvent" + "
" + 
                "data:" + new Date().toLocaleString() + "

"
            );
        }, 1000);
    } else {
        fs.readFile('./index.html', function (err, content) {
            res.writeHead(200, {'Content-Type': 'text/html'});
            res.end(content, 'utf-8');
        });
    }

}).listen(3000);