服务器推送初探

服务器推送，Comet，反向Ajax，多种名字，捯饬起来也是相当费劲。

先来看服务端：

w3cSchool有个简单的例子，http://www.w3school.com.cn/html5/html_5_serversentevents.asp。

对于php，有几点需要注意：

1）设置header，

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

若不设置，会报错的。

2）在echo信息的时候，如果字符串过短，会不输出

最好先输出一堆空格：

str_repeat(‘ ‘, 4000)

3）echo信息以\n\n或者\r\n\r\n结束。

4）echo信息以data:开头

5）强制信息输出

flush();

//若使用ob_start()，还需要ob_flush()

一般来说都会操作数据库，数据库有新信息时就会推动到客户端，然后再其置为已读。

下面是我的代码：

<?php

header(‘Content-Type: text/event-stream‘);
header(‘Cache-Control: no-cache‘);

$db = new mysqli(‘localhost‘, ‘root‘, ‘111111‘, ‘table‘);
$db->query(‘set names utf8‘);

set_time_limit(0);
ob_start();

while (1) {
        $query = ‘select * from alarms where username = "test12" and is_alarmed = "0"‘;
        $result = $db->query($query);
        $row = $result->fetch_assoc();
        if(!empty($row)) {
            echo ‘data: ‘.str_repeat(‘ ‘, 4000).json_encode($row);
            echo "\n\n";
            ob_flush();
            flush();

            $sql = ‘update alarms set is_alarmed = "1" where alarm_id = "‘.$row[‘alarm_id‘].‘"‘;
            $db->query($sql);
        }

        sleep(1);
}

?>

客户端的话，使用比较新的EventSource实现，比较简单

        var ticker = new EventSource(‘server.php‘);

        ticker.onmessage = function(e) {
            var data = JSON.parse(e.data);
　　　　　　　console.log(data);

        }

这个还比较新，网上资料比较少，还是有问题没有解决。继续更新。。。。

参考：

HTML 5 服务器发送事件

EventSource

使用服务器发送事件

Html5实践之EventSource