ajax bootstrap Arrêtez le navigateur "throbber of doom" en chargeant comet/server push iframe




loading logo (4)

Lorsque vous utilisez des techniques Comet, ou Ajax Long Pull - un iframe est généralement utilisé. Et pendant que cette iframe attend la fermeture de la longue connexion, le navigateur tourne son throbber (l'indicateur de progression / chargement).

Certains sites Web, par exemple etherpad.com, ont réussi à l'arrêter.

Comment font-ils?


Answer #1

Pour moi, lancer un setTimeout sur la requête ajax a tout résolu. Quand j'ai couru la demande de document.ready, j'ai eu le "throbber of doom". Mais avec setTimeout ça n'arrive pas. (Cette correction fonctionne également pour Chrome).


Answer #2

Juste au cas où vous pourriez avoir besoin de quelques exemples, ce type a donné une solution pour résoudre le problème de Firefox. http://www.shanison.com/?p=237


Answer #3

J'ai eu le même problème, et la solution était d'utiliser Ajax au lieu de iframe caché. Donc, au lieu de générer un iframe quelque part dans la page:

$("#chat .msg_list").prepend('<iframe id="hidden" src="chatFrame?id=$userId" frameborder="0" height="0" width="100%"></iframe>');

J'ai utilisé jquery ajax call pour charger le contenu d'iframe dans une div:

$('#chat #chat_comet').load('chatFrame?id=$userId');

Answer #4

Après avoir creusé un jour et une nuit dans le ventre des internets, voici ce que j'ai trouvé:

  1. événements envoyés par le serveur - Très cool, ne fonctionne actuellement que dans Opera, mais peut faire partie de HTML5 et d'autres navigateurs peuvent le soutenir parfois. Ajoute une nouvelle balise d'élément avec le type de contenu "application / x-dom-event-stream" qui permet au serveur de déclencher des événements dans le DOM client . Et il ne devrait pas montrer un indicateur de progrès, autant que je comprends. C'est aussi un brouillon d'une norme, et pas un hack comme toute la comète iframe.

  2. XMLHttpRequest - dans Firefox et Safari, mais pas dans IE, il peut être utilisé pour le chargement de page à long tirage qui permet de gérer les fragments tels qu'ils apparaissent sur chaque événement readyStateChange. Ne montrera pas l'indicateur de progression *. - voir le commentaire ci-dessous

  3. ActiveXObject ("htmlfile") - peut être utilisé dans IE pour créer une page / fenêtre qui est en dehors de la portée de la fenêtre en cours. Cela fait disparaître l'indicateur de progression! L'iframe chargé sera dans un navigateur invisible.

En savoir plus sur les événements envoyés par le serveur:

Et plus sur les deux autres techniques (explique aussi le problème mieux): * http://meteorserver.org/browser-techniques/

Encore plus en profondeur sur chaque technique, et plus de techniques:





throbber