Başlangıçta düşündüğümden daha basit .. Temelde, göndermek istediğiniz veriler mevcut olana kadar (yeni bir mesaj geldiğinde) hiçbir şey yapmayan bir sayfanız var.
İşte 2-10 saniye sonra basit bir dize gönderen gerçekten temel bir örnek. 404 hatası döndürme şansından 1'i (gelecek Javascript örneğinde hata işlemeyi göstermek için)
msgsrv.php
<?php
if(rand(1,3) == 1){
/* Fake an error */
header("HTTP/1.0 404 Not Found");
die();
}
/* Send a string after a random number of seconds (2-10) */
sleep(rand(2,10));
echo("Hi! Have a random number: " . rand(1,10));
?>
Not: Gerçek bir site ile, bunu Apache gibi normal bir web sunucusunda çalıştırmak, tüm "işçi iş parçacıklarını" hızlı bir şekilde bağlayacak ve diğer isteklere yanıt verememesine neden olacaktır .. Bunun için yollar vardır, ancak yazmanız önerilir Python's gibi bir şeyde "uzun anket sunucusu" istek başına bir iş parçacığına dayanmayan bükülmüş hali . cometD popülerdir (birkaç dilde mevcuttur) ve Tornado bu tür görevler için özel olarak yapılmış yeni bir çerçevedir (FriendFeed'in uzun sorgulama kodu için inşa edilmiştir) ... ancak basit bir örnek olarak Apache yeterli olmaktan daha fazlasıdır ! Bu komut dosyası kolayca herhangi bir dilde yazılabilir (Çok yaygın oldukları için Apache / PHP'yi seçtim ve bunları yerel olarak çalıştırıyorum)
Ardından, Javascript'te, yukarıdaki dosyayı ( msg_srv.php) isteyin ve bir yanıt bekleyin. Bir tane aldığınızda, veriler üzerinde hareket edersiniz. Sonra dosyayı isteyin ve tekrar bekleyin, verilere göre hareket edin (ve tekrarlayın)
Aşağıda böyle bir sayfanın bir örneği var .. Sayfa yüklendiğinde, msgsrv.phpdosya için ilk isteği gönderir .. Başarılı olursa, #messagesdiv öğesine mesaj ekleriz, sonra 1 saniye sonra tekrar waitForMsg işlevini çağırırız, ki bu beklemeyi tetikler.
1 saniye setTimeout()gerçekten temel bir hız sınırlayıcıdır, bu olmadan iyi çalışır, ancak msgsrv.php her zaman anında dönerse (örneğin bir sözdizimi hatasıyla) - tarayıcıyı sele uğrarsınız ve hızlı bir şekilde donabilir. Bu, dosyanın geçerli bir JSON yanıtı içerip içermediğini kontrol etmek ve / veya çalışan / dakika başına saniyede istek toplamını tutmak ve uygun şekilde duraklatmak daha iyi olur.
Sayfa hataları varsa, hatayı #messagesdiv öğesine ekler, 15 saniye bekler ve sonra tekrar dener (her mesajdan 1 saniye sonra nasıl beklediğimizle aynıdır)
Bu yaklaşımın güzel yanı çok esnek olmasıdır. İstemcilerin internet bağlantısı koparsa, zaman aşımına uğrar, ardından yeniden bağlanmayı dener - bu, yoklamanın ne kadar sürdüğünün doğasında bulunur, karmaşık bir hata işlemeye gerek yoktur
Her neyse, long_poller.htmjQuery çerçevesini kullanan kod:
<html>
<head>
<title>BargePoller</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js" type="text/javascript" charset="utf-8"></script>
<style type="text/css" media="screen">
body{ background:#000;color:#fff;font-size:.9em; }
.msg{ background:#aaa;padding:.2em; border-bottom:1px #000 solid}
.old{ background-color:#246499;}
.new{ background-color:#3B9957;}
.error{ background-color:#992E36;}
</style>
<script type="text/javascript" charset="utf-8">
function addmsg(type, msg){
/* Simple helper to add a div.
type is the name of a CSS class (old/new/error).
msg is the contents of the div */
$("#messages").append(
"<div class='msg "+ type +"'>"+ msg +"</div>"
);
}
function waitForMsg(){
/* This requests the url "msgsrv.php"
When it complete (or errors)*/
$.ajax({
type: "GET",
url: "msgsrv.php",
async: true, /* If set to non-async, browser shows page as "Loading.."*/
cache: false,
timeout:50000, /* Timeout in ms */
success: function(data){ /* called when request to barge.php completes */
addmsg("new", data); /* Add response to a .msg div (with the "new" class)*/
setTimeout(
waitForMsg, /* Request next message */
1000 /* ..after 1 seconds */
);
},
error: function(XMLHttpRequest, textStatus, errorThrown){
addmsg("error", textStatus + " (" + errorThrown + ")");
setTimeout(
waitForMsg, /* Try again after.. */
15000); /* milliseconds (15seconds) */
}
});
};
$(document).ready(function(){
waitForMsg(); /* Start the inital request */
});
</script>
</head>
<body>
<div id="messages">
<div class="msg old">
BargePoll message requester!
</div>
</div>
</body>
</html>