php + ajax + comet 长轮询 做 简单的即时通讯

大致逻辑:

PHP服务器端通过 while 做循环判断是否有新数据返回,并且在有新数据后跳出循环终止本次请求。

并且通过 set_time_limit 给本次请求设置最长持续时间,以便在while如果一直不跳出循环的情况下 终止本次请求。

 

HTML 端使用ajax 请求服务器,并且在服务器回答后(不管有没有返回内容),再重新请求。

 

 

php文件

<?PHP
error_reporting(0);
//设置允许脚本运行的时间,单位为秒。如果超过了此设置,脚本返回一个致命的错误。默认值为30秒
set_time_limit(10);
$filename = './data.txt';


// 接受消息 写入 数据文件
$msg = isset($_GET['msg']) ? $_GET['msg'] : '';
if ($msg != ''){
	file_put_contents($filename,$msg);
	die();
}





$lastmodif    = isset($_GET['timestamp']) ? $_GET['timestamp'] : 0;
$currentmodif = filemtime($filename);

while ($currentmodif <= $lastmodif){ // 如果数据文件已经被修改
	sleep(1); // 100ms暂停 缓解CPU压力
	clearstatcache(); //清除缓存信息

	$currentmodif = filemtime($filename);

}

$response = array();
$response['msg']       = file_get_contents($filename);
$response['timestamp'] = $currentmodif;

echo json_encode($response);
flush();
?>

html

<meta content="text/html; charset=UTF-8" http-equiv="Content-Type">
<title>Comet Test</title>
<script type="text/javascript" src="http://lib.sinaapp.com/js/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">
(function($){
    function handleResponse(data){
		$('#content').append('<div>' + data['msg'] + '</div>');
    }
 
    var timestamp = 0;
    var url = './chat_backend.php';
    var noerror = true;
    var ajax;
 
    function connect() {
        ajax = $.ajax(url, {
            type: 'get',
            data: { 'timestamp' : timestamp },
			dataType:"json",
            success: function(data) {
				if(data != null){
					timestamp = data.timestamp;
					handleResponse(data);
					noerror = true;
				}
            },
            complete: function(transport) {
				//如果服务器返回异常, 5s 后重试。 如果返回正常 就马上重试
				if(noerror == false){
					setTimeout(function(){ connect() }, 5000);
				}else{
					connect();
				}
                noerror = false;
            }
        });
    }
 
    function doRequest(request) {
        $.ajax(url, {
            type: 'get',
            data: { 'msg' : request }
        });
    }
 
    $('#cometForm').live('submit', function(){
        doRequest($('#word').val());
        $('#word').val('');
        return false;
    });
 
    $(document).ready(function(){
        connect();
    });
})(jQuery);
</script>
<div id="content" style="margin-bottom:100px"></div>


<div style="margin: 5px 0;position:fixed;bottom:0px;background:#aaa;">
<form action="javascript:void(0);" id="cometForm" method="get">
<input id="word" name="word" type="text" value="" autocomplete="off" >
<input name="submit" type="submit" value="Send">
 
</form></div>
 

 

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值