Eventos enviados pelo servidor permitir que uma página web para obter atualizações de um servidor.
Eventos enviados pelo servidor - One Way Messaging
Um evento enviou-servidor é quando uma página web recebe automaticamente as atualizações de um servidor.
Isso também era possível antes, mas a página web teria que perguntar se há atualizações disponíveis. Com eventos enviados pelo servidor, as atualizações vêm automaticamente.
Exemplos: Facebook/Twitter atualizações, atualizações de preços de ações, feeds de notícias, resultados desportivos, etc.
Suporte navegador
Os números na tabela especificar a primeira versão do browser que suporta totalmente eventos enviados pelo servidor.
API | |||||
---|---|---|---|---|---|
SSE | 6 | Não suportado | 6 | 5 | 11,5 |
Receber notificações de eventos enviados pelo servidor
O EventSource objeto é usado para receber notificações de eventos enviados pelo servidor:
Exemplo
var source = new EventSource("demo_sse.php");
source.onmessage = function(event) {
document.getElementById("result").innerHTML += event.data + "<br>";
};
Tente você mesmo " Exemplo explicado:
- Criar um novo EventSource objeto e especificar o URL da página de envio das atualizações (in this example "demo_sse.php")
- Cada vez que uma atualização é recebida, o onmessage evento ocorre
- Quando um onmessage evento ocorre, colocar os dados recebidos no elemento com id="result"
Check Prova Eventos enviados pelo servidor
No tryit exemplo acima houve algumas linhas extras de código para verificar o suporte ao navegador para eventos enviados pelo servidor:
if(typeof(EventSource) !== "undefined") {
// Yes! Server-sent events support!
// Some code.....
} else {
// Sorry! No server-sent events support..
}
Do lado do servidor Exemplo de código
Para o exemplo acima para trabalhar, você precisa de um servidor capaz de enviar atualizações de dados (como PHP ou ASP).
A do lado do servidor sintaxe fluxo de eventos é simples. Defina o "Content-Type" cabeçalho para "text/event-stream" . Agora você pode começar a enviar fluxos de eventos.
Código 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();
?>
Código em ASP (VB) (demo_sse.asp) :
<%
Response.ContentType = "text/event-stream"
Response.Expires = -1
Response.Write("data: The server time is: " & now())
Response.Flush()
%>
Código explicou:
- Defina o "Content-Type" cabeçalho para "text/event-stream"
- Especificar que a página não deve armazenar em cache
- Saída os dados para enviar ( Always start with "data: ")
- Lave os dados de saída de volta para a página de web
O objeto EventSource
Nos exemplos acima, aproveitou o evento onMessage para obter mensagens. Mas outros eventos também estão disponíveis:
Eventos | Descrição |
---|---|
onopen | Quando uma conexão com o servidor é aberto |
onmessage | Quando uma mensagem é recebida |
onerror | Quando ocorre um erro |