1, Basics
The concept HTTP streaming
Persistent HTTP streaming is just a simple method for holding open an HTTP link, this does not require a large amount of HTTP requests opening and closing operation can be sent one by one.
Common PHP function
sleep(10); //暂停 10 秒
ob_flush();
flush();
PHP function periodically sends data to the browser, not all servers are feasible, for more information, see www.php.net/flush . About content flush, refer to the in-depth understanding of the difference between ob_flush and flush .
Execution time <script> tag
In most browsers, if not yet read </ script> tag at the end of the code is not executed.
The maximum configuration script execution time
When Comet execution, often exceeds the maximum execution time of php script, so you need to configure max Execution Time (detailed reference: PHP - PHP.ini configuration Chinese interpretation ), in conjunction with the heartbeat mechanism.
was iTimer;
function heartbeat() {
clearTimeout(iTimer);
iTimer = setTimeout(function(){
// perform a Comet
// 300 is a server-side configuration of max_execution_time
}, 300);
}
2, Comet implementation method
IE browser
demo.html
<script type="text/javascript">
var oPage = new ActiveXObject("htmlfile");
oPage.open();
oPage.write("<html><body></body></html>");
oPage.close();
oPage.body.innerHTML = '<iframe src="connection.php"></iframe>';
oPage.parentWindow._parent = self;
function heartbeat() {}
function modifiedAt() {}
</script>
- oPage.parentWindow access is window object attributes HTMLFile
- connection.php in JS using top or parent window to access the property is not demo.html
- connection.php the top or JS used to access parent object window property HTMLFile
connection.php
<html>
<head></head>
<body>
<script type="text/javascript">
parent._parent.heartbeat();
parent._parent.modifiedAt ();
</script>
</body>
</html>
Other browsers
demo.html
var oXHR = new XMLHttpRequest();
oXHR.open('get', 'connection.php', true);
oXHR.readystatechange = function() {
switch (oXHR.readyState) {
case 3:
alert(oXHR.responseText);
break;
case 4:
alert('done');
}
};
- Each time the server receives data from (ie, the server calls "ob_flush (); flush ();"), the event will trigger readyStatechange.
- When 3 readyState equal, content oXHR.responseText returned, this change is not new content, but received before the new content + content of this change.
3, LiveConnect HTTP streaming
LiveConnect is Firefox, Safari and Opera support an underutilized technology, you can then use JavaScript kinds of Java objects through it, but the client must install the JRE, and the browser must be enabled Java.
4, Dom event sent by the server
Examples
demo.html
<body>
<event-source id="iBox" src="connection.php" />
<script type="text/javascript">
var iBox = document.getElementById('iBox');
iBox.addEventListener('modified', function(oEvent){
console.log(oEvent);
});
</script>
</body>
connection.php
<?php
header("Content-type:application/x-dom-event-stream");
while (true) {
echo 'Event: modified';
echo 'data: 5:23:06';
ob_flush();
flush();
sleep(1);
}
?>
- It is used to keep open a link
- Event followed event name, the rest is a property of the event object; use of a blank between each two newline distinguish events.
- Target elements followed triggered a format similar to CSS selectors. * At doubt, the server-side event handler will trigger the browser's default event, namely to <input type = "submit" /> send click events will not submit the form, or click to call only the binding elements function?
- Dom server sends an event can trigger a custom event, the example of "modified" event is a custom event. UI events can also trigger the client, all events Dom Level 3 Events specification named Dom can be triggered by an event on the server side.
- Do not have to bind the event handler for the element, each event will automatically be passed to the target element by the event handler calcium is responsible for processing the following example.
Returns the contents
Event: click Target: #iBox button: 2 screenX: 0 screenY: 0 Event: click Target: Document data: See you later!
Supportive
Until October 2006, Opera9.0.1 Dom event is the only supported browser sent by the server, Opera 11.52 has been tested and is not supported.
5, connection management
HTTP1.1 the agreement, a client while maintaining a maximum of two connections (this depends on the browser, Thunder and other download tools that will increase the number of concurrent). Comet is the use of consequences will occupy a connection, the specific solution is to appoint a special sub-domain name Comet.
Comet will also increase the number of concurrent server, so maintenance personnel to communicate with the server before using Comet technology, to ensure that they understand the functions to be achieved, and give support.
Comet technology as early as around 2007 it was suggested that the first article is the What IS Burried Down in the else at The Amazing depth's of Google's JavaScript? , Has yet to use a large area. The main reason lies in changes in spending patterns and the development of its servers, on the other hand can be a good alternative to the use of the vast majority of Ajax Comet case.
Reproduced in: https: //www.cnblogs.com/rainman/archive/2011/11/28/2266193.html