Вопросы Теги

Как удалить колесо загрузки Safari при использовании событий, отправленных сервером

Я использую HTML5 Server Sent Events для передачи обновлений своим онлайн-клиентам. Все отлично работает в Firefox и Chrome, но в Safari все время есть колесо загрузки. Может быть, потому что он определяет SSE как что-то загружающееся на странице.

Как я могу сказать Safari, что SSE — это не то, что загружается, а просто скрипт обновления, поэтому пользователь не увидит колесико загрузки после того, как страница действительно загрузится?

Это обновленная html-страница, которую просматривает клиент:

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>SSE Tester</title>
</head>
<body>
    <h1>SSE Output</h1>
    <div id="result"></div> 
    <h1>Debug Console</h1>
    <div id="status"></div>   
    <script>
    //SSE si compatible
    if(typeof(EventSource)!=="undefined")
    {
        var i = 1;
        var source=new EventSource("demo_sse.php");



        //Lorsque le serveur envoie un message
        source.onmessage=function(event)
        {
            //Validation de l'origine du serveur
            if (event.origin != 'https://secure.mydomain.com') 
            {
                document.getElementById("status").innerHTML+= "<br><b>Oups! Looks like something went wrong!\n\nPlease contact webmaster@mydomain.com with the following error :</b><p><pre>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;The Origin of the EventSource wasn\'t coming from our secure server!</pre>";
                return;
            }
            document.getElementById("result").innerHTML+= "#" + i + " " + event.data + "<br />";            
            i++;
        }   

        //EventListener
        source.addEventListener('message', function(e)
        {
            console.log(e.data);
            //document.getElementById("status").innerHTML+= "Message Recevied<br />";
        }, false);

        source.addEventListener('open', function(e) 
        {
            // Connection was opened.
            document.getElementById("status").innerHTML+= "Connection #" + i + " opened<br />";
        }, false);

        source.addEventListener('error', function(e)
        {
            if (e.readyState == EventSource.CLOSED)
            {
                // Connection was closed.
                document.getElementById("status").innerHTML+= "Connection closed by the server<br />";
            }
            else
            {
                // Error.
                document.getElementById("status").innerHTML+= "<b>Error Connection interrupted</b><br />";
            }
        }, false);
    }
    else
    {
        document.getElementById("result").innerHTML="Sorry, your browser does not support server-sent events...";
    }     

    </script>    
</body>
</html>

А вот код моего скрипта demo_sse.php (на стороне сервера):

<?php
$clientLatest = "1";
header('Content-Type: text/event-stream');
header('Cache-Control: no-cache');
while(true)
{
    //Retreive latest version
    $filename = "version.txt";
    $handle = fopen($filename, "r");
    $serverLatest = fread($handle, filesize($filename));
    fclose($handle);

    if ($clientLatest < $serverLatest)
    {
        //Update client 
        $time = date("H:i:s");
        echo "data: Updating to Version: $serverLatest because client's Version: $clientLatest at: {$time}\n\n";
        $clientLatest = $serverLatest;
        ob_flush();
        flush();
    }   
    //sleep( rand(2, 7));
    sleep(1);
}
?>
5
задан exomic 29 March 2012 в 20:04
поделиться