YLBTECH-HTML5:HTML5 Server Send events (server-sent events) |
1, HTML5Server Send events (server-sent events)
HTML5 Server Send events (Server-sent event) allow Web pages to get updates from the server .
Server-sent Event-one-way message delivery
the Server-sent event refers to a webpage that automatically obtains updates from the server .
This could have been done before, provided the Web page had to ask if there were any updates available. Events are sent through the server, and updates are automatically reached.
Examples:facebook/twitter updates, valuation updates, new posts, tournament results , and more.
Browser support
All major browsers support server sending events, in addition to Internet Explorer.
Receive Server-sent event notifications
The EventSource object is used to send event notifications to the receiving server:
Instance
var source=New EventSource ("demo_sse.php"); source.onmessage=function( Event) { document.getElementById ("result"). Innerhtml+=event.data + "<br>";};
Try it?
Instance parsing:
- Create a new EventSource object, and then specify the URL of the page that is sending the update ("demo_sse.php" in this case)
- OnMessage event occurs every time an update is received
- When the OnMessage event occurs, the received data is pushed into the element with the ID "result"
Detect Server-sent Event Support
In the following example, we have written an extra piece of code to detect the browser support of the server sending events:
if (typeof(EventSource)!== "undefined") { // browser support server-sent // some code ..... }else{// Browser does not support server-sent ...}
Server-side Code instances
To make the above example work, you also need a server that can send data updates (such as PHP and ASP).
The syntax of the server-side event stream is very simple. Set the "Content-type" header to "Text/event-stream". Now you can start sending the event stream.
Instance
<? Header(' Content-type:text/event-stream 'header(' Cache-control:no-cache ' ) $timedate(' R 'echo ' data:the server time is: {$time}\n\n " flush?>
ASP Code (VB) (demo_sse.asp):
<%Response.ContentType="text/event-stream"response.expires=- 1 Response.Write ("" & Now ()) Response.Flush ()%>
Code Explanation:
- Set the header "Content-type" to "Text/event-stream"
- No caching of pages is required
- Output send date (always start with "data:")
- Refresh output data to a Web page
EventSource Object
In the example above, we use the OnMessage event to get the message. However, you can also use other events:
Events |
Description |
OnOpen |
When the connection to the server is opened |
OnMessage |
When a message is received |
OnError |
When an error occurs |
2.
1, HTTP://WWW.RUNOOB.COM/HTML/HTML5-SERVERSENTEVENTS.HTML2,
|
Ylbtech Source: http://ylbtech.cnblogs.com/ This article is copyright to the author and the blog Park, Welcome to reprint, but without the consent of the author must retain this paragraph, and in the article page obvious location to the original link, otherwise reserves the right to pursue legal responsibility. |
HTML5:HTML5 Server Send events (server-sent events)