Meilleure façon d'afficher les commentaires "en direct"

Question

Je veux afficher les commentaires des utilisateurs dans une grille (assez facile), mais je veux montrer les nouveaux enregistrements à mesure qu'ils arrivent. En théorie, l'utilisateur reste un moment sur cette page, ajoutant ses propres commentaires et visualisant ceux des autres.

Il se comporte comme une fenêtre de discussion avec plusieurs utilisateurs qui font des commentaires, même si je ne m'y attends pas être aussi actif qu'un (je m'attends à ce qu'il soit à peu près aussi mis à jour par intermittence qu'un mur Facebook)

J'ai considéré: - jQuery + AJAX + Minuteur?
- Sockets Web. Les sockets Web sont-ils prêts en prime time? Et Web Sockets peut-il être implémenté avec ASP.NET + IIS?

Je suis à la recherche d'une solution élégante, propre, rapide (faible bande passante, ne chargez les nouveaux commentaires que si possible, en supprimant les plus anciens) et pas trop ésotérique sur une plateforme ASP.NET/IIS. Ne savez pas comment s'y prendre, merci de demander votre aide.

Merci!

PS J'ai essayé de chercher sur "système de commentaires" "montrer de nouveaux enregistrements" "systèmes de chat", mais n'a pas pu atteindre tout à fait les résultats que j'ai cherché.

Answer 1

Essayez cette

var interval=2; // on page load

ajax synchronisation avec le serveur pour toutes les 2 secondes et l'intervalle événements remis à zéro mouse || keyboard-2 et tous les 10 appels ajax augmenter l'intervalle de rafraîchissement de 1 sec. De cette façon, vous pouvez contrôler la charge du serveur. et économisera de la bande passante pour le client et le serveur.

Ces valeurs peuvent être ajustées selon vos besoins

Answer 2

Quelqu'un d'autre peut avoir un meilleur exemple, mais je jouer avec une application web de chat AJAX. Voici ce que j'ai fait en utilisant ASP.net et JQuery.

<script type="text/javascript"> 
    $(document).ready(function() { 
     $("#btnSend").click(function() { 
      addMessage(); 
     }); 
     return false; 
    }); 

    function refreshChat() { 
     $.get("messages.aspx", function (data) { 
      $("#chatbox").empty(); 
      $("#chatbox").prepend(data); 
      var $t = $("#chatbox"); //whatever the selector you use. 
      $t.animate({ scrollTop: $t.attr("scrollHeight") }, 3000); 
     }); 

     setTimeout(refreshChat, 5000); 
    } 

    function addMessage() { 
     $.get("messages.aspx", { usr: $("#usr").val(), msg: $("#msg").val() }); 
     $("#msg").val(''); 
     $("#msg").focus(); 
    } 
</script> 

HTML:

<div id="input"> 
    username: 
    <input type="text" name="usr" id="usr" /><br /> 
    message: 
    <textarea rows="3" id="msg" name="msg"></textarea> 
    <br /> 
    <input type="button" id="btnSend" name="btnSend" value="Send" /> 
</div> 
<div id="chatbox" style="height: 300px; overflow: scroll;"> 
</div> 

Utilisez le message.aspx pour enregistrer de nouveaux messages dans une base de données et d'interrogation pour les nouveaux enregistrements à ajouter à la div msg.