Événements serveur-Sent permettent une page Web pour obtenir des mises à jour à partir d'un serveur.
Événements serveur-Sent - One Way Messaging
Un événement envoyé sur le serveur est lorsqu'une page Web est automatiquement mises à jour à partir d'un serveur.
Cela a également été possible avant, mais la page Web devrait demander si des mises à jour sont disponibles. Avec les événements envoyés par le serveur, les mises à jour sont automatiquement.
Exemples: Facebook/Twitter mises à jour, les mises à jour des prix des actions, des nouvelles RSS, les résultats sportifs, etc.
Support du navigateur
Les chiffres du tableau indiquent la première version du navigateur qui supporte entièrement les événements envoyés par le serveur.
API | |||||
---|---|---|---|---|---|
SSE | 6.0 | Non supporté | 6.0 | 5.0 | 11.5 |
Recevoir Sent-serveur notifications d'événements
Le EventSource objet est utilisé pour recevoir les notifications d'événement envoyé par le serveur:
Exemple
var source = new EventSource("demo_sse.php");
source.onmessage = function(event) {
document.getElementById("result").innerHTML += event.data + "<br>";
};
Essayez vous - même » Exemple expliqué:
- Créer un nouveau EventSource objet et spécifier l'URL de la page d' envoyer les mises à jour (in this example "demo_sse.php")
- Chaque fois qu'une mise à jour est reçue, le onmessage événement se produit
- Lorsqu'un onmessage événement se produit, mettre les données reçues dans l'élément avec id="result"
Vérifiez les événements serveur Sent soutien
Dans le tryit exemple ci - dessus , il y avait quelques lignes de code supplémentaires pour vérifier le soutien du navigateur pour les événements envoyés par le serveur:
if(typeof(EventSource) !== "undefined") {
// Yes! Server-sent events support!
// Some code.....
} else {
// Sorry! No server-sent events support..
}
Côté serveur Exemple de code
Pour l'exemple ci-dessus fonctionne, vous avez besoin d'un serveur capable d'envoyer des mises à jour de données (comme PHP ou ASP).
La syntaxe de flux d'événements côté serveur est simple. Réglez le "Content-Type" tête à "text/event-stream" . Maintenant, vous pouvez commencer à envoyer des flux d'événements.
Code en PHP (demo_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();
?>
Code dans ASP (VB) (demo_sse.asp) :
<%
Response.ContentType = "text/event-stream"
Response.Expires = -1
Response.Write("data: The server time is: " & now())
Response.Flush()
%>
Code explique:
- Réglez le "Content-Type" tête à "text/event-stream"
- Spécifiez que la page ne doit pas mettre en cache
- Sortie les données à envoyer ( Always start with "data: ")
- Purger les données de sortie vers la page web
L'objet EventSource
Dans les exemples ci-dessus, nous avons utilisé l'événement onmessage pour obtenir des messages. Mais d'autres événements sont également disponibles:
Événements | La description |
---|---|
onopen | Lorsqu'une connexion au serveur est ouvert |
onmessage | Lorsqu'un message est reçu |
onerror | Lorsqu'une erreur se produit |