AJAX appeler un code PHP et obtenir une réponse toutes les quelques minutes

Question

Je suis en train de créer un panneau de message très simple (auteur, texte, et la date écrite) qui sera automatiquement mise à jour toutes les quelques instants pour voir si un nouveau message arrivé, et si c'est le cas, charger automatiquement le dernier message (s).

Je suis compétent en PHP, mais mes connaissances en AJAX fait défaut.

La façon dont je le vois, je dois créer un fichier PHP appelé get_messages.php qui se connecter à une base de données et passer à travers un rendement variable $_GET tous les messages au-delà de la date X, et alors je en quelque sorte par appel jquery ce fichier PHP toutes les quelques minutes avec $_GET=current time? Cela vous semble-t-il correct?

Comment aurais-je eu au sujet de la demande et renvoyer les données à la page Web de manière asynchrone?

Answer 1

Vous êtes assez proche, vous aurez besoin d'un script PHP qui peut interroger la base de données pour vos résultats. Ensuite, vous aurez envie de transfigurer ces résultats dans un tableau, et les json_encode():

$results = getMyResults(); 
/* Assume this produce the following Array: 
    Array(
    "id" => "128","authorid" => "12","posttime" => "12:53pm", 
    "comment" => "I completely agree! Stackoverflow FTW!" 
    ); 
*/ 
print json_encode($results); 
/* We'll end up with the following JSON: 
    { 
    {"id":"128"},{"authorid":"12"},{"posttime":"12:53pm"}, 
    {"comment":"I completely agree! Stackoverflow FTW!"} 
    } 
*/ 

Une fois que ces résultats sont au format JSON, vous pouvez mieux les manipuler avec javascript. En utilisant jQuery de ajax functionality, nous pouvons faire ce qui suit:

setInterval("update()", 10000); /* Call server every 10 seconds */ 

function update() { 
    $.get("serverScript.php", {}, function (response) { 
    /* 'response' is our JSON */ 
    alert(response.comment); 
    }, "json"); 
} 

Maintenant que vous avez vos données, vous êtes libre d'utiliser les informations du serveur dans javascript (« réponse »).

Answer 2

Ignorer les choses ASP.NET, ce lien est un bon début:

http://www.aspcode.net/Timed-Ajax-calls-with-JQuery-and-ASPNET.aspx

Qu'est-ce que vous allez utiliser est une fonction javascript appelé setTimeout, qui appelle de manière asynchrone une fonction javascript sur un intervalle . De là, jQuery a une fonction fantaisie appelée "load" qui chargera les résultats d'un appel AJAX dans un DIV ou n'importe quel élément que vous recherchez. Il existe également de nombreux autres moyens pour que jQuery modifie le DOM comme vous le souhaitez.

Il y a cent façons de le faire, mais je dirais que Javascript faut éviter d'écrire simplement pour vous sauver le mal de tête de la fonctionnalité multi-navigateur quand vous le pouvez.

Answer 3

Je vous conseille d'aller le disponible sur le code Google simple AJAX code-Kit (SACK).

Je l'utilise depuis qu'il était sur Google code. C'est très léger et direct. C'est un fichier js que vous devez inclure. Je l'ai vu être utilisé dans les jeux par navigateur en ligne aussi bien.

http://code.google.com/p/tw-sack/

Exemple de contenu de la page de chargement de get_messages.php dans un div (si vous ne se soucient pas du contenu de la page de get_messages.php, et que vous voulez simplement appeler le fichier php, simple supprimer la ligne ajax.element):

<script type="text/javascript" src="tw-sack.js"></script> 
<script> 
var ajax = new sack(); 
ajax.method = "GET"; // Can also be set to POST 
ajax.element = 'my_messages'; // Remove to make a simple "ping" type of request 
ajax.requestFile = "get_messages.php"; 
ajax.setVar("user_name","bobby"); 
ajax.setVar("other_variables","hello world"); 
ajax.setVar("time",dateObject.getTime()); 
ajax.onCompleted = whenCompleted; 
ajax.runAJAX(); 

function whenCompleted(){ 
    alert('completed'); 
} 
</script> 

<div id="my_messages">Loading...</div> 

vous n'avez pas besoin de spécifier une « ajax.element » si vous voulez faire un simple type de requête « ping » et ignorer la sortie du fichier php. Tout ce que vous avez à faire pour implémenter vos exigences maintenant est d'utiliser un "setTimeout" faisant les appels ajax.

Il y a aussi beaucoup d'autres options comme:

//ajax.onLoading = whenLoading; 
//ajax.onLoaded = whenLoaded; 
//ajax.onInteractive = whenInteractive; 

Pas besoin d'apprendre ou d'inclure des cadres énormes. Et vous allez commencer en un rien de temps avec tw-sack.