Créer un module live : php ?

Créer un module live : php ? - PHP - Programmation

Marsh Posté le 13-06-2011 à 10:11:20    

Bonjour,
 
Créateur d'un site internet d'un club de basket, je souhaite, en vue de la prochaine saison, créer un module de live, de direct, où les gens pourront suivre l'évolution du score et d'autres statistiques en direct.
Je souhaite donc mettre au point un module, mais ne sait pas trop par où commencer.
Je maitrise le php, mais est-ce la meilleure solution ?
J'ai visité pas mal de sites et il y a du très bon. Tous les sites de paris sportifs utilisent du flash pour ce genre de module en direct. Mais peut-on y intégrer le php ? La méthode est-elle la même ? L'avantage avec du flash est qu'il ne faut pas rafraichir la page j'imagine.
 
Merci d'avance...

Reply

Marsh Posté le 13-06-2011 à 10:11:20   

Reply

Marsh Posté le 13-06-2011 à 13:53:56    

Salut, pour le direct il faut juste utiliser le système des chat, (plus simple) tu créer un module qui demande constamment si il y a du changement (javascript) , sinon tu peut créer une web radio qui fonctionne seulement quand il y a un match et les gens pourrons l'écouter en direct.
 
Pour ton module, tu fait une action en boucle, toutes les X secondes ton script se relance, demande si il a un changement de score, si oui il actualise dynamiquement la page, sinon il reviens au début de la boucle, il attend X secondes etc...
 
Système javascript pour communiquer avec php sans relancer ta page:
 
1: tu lance la fonction au chargement de la page.
 

Code :
  1. <body onLoad="actualiseScore();" >


 
2: la fonction. (javascript)
 

Code :
  1. //cherche le score
  2. function actualiseScore()
  3. {
  4. //connexion au fichier php.
  5. if(text = fileLog('php/actualiseScore.php))
  6. {
  7.  eval(text);
  8. }
  10. //boucle tout les XXXX millièmes de secondes
  11. setTimeout(actualiseScore, 1000);
  12. }


 
3: le fichier actualiseScrore.php
 
Bon bah la je peut pas t'aider tu doit le faire par rapport à ta page mais voila quoi faire.
 
Connexion à ta base de données.
Recherche du score.
puis un "echo" de code javascript.
 
donc j'explique l'echo:
 
javascript appel la page php puis fait un "eval" sur se qui reviens.
"eval" lance en faite se qui reviens comme si c'était du javascript.
donc tu doit faire un echo truc du genre:
 

Code :
  1. <?php
  2. error_reporting(E_ALL);
  4. mysql_connect($login['serveur'], $login['account'], $login['password']);
  5. mysql_select_db($login['database']);
  7. //Recherche du score
  8. $query = mysql_query('SELECT * FROM ma_base') or die (mysql_error());
  9. $data = mysql_fetch_array($query);
  11. echo'
  12. document.getElementById(\'id_de_la_balise_ou tu met le score 1\').innerHTML = \''.$data['score1'].'\';
  13. document.getElementById(\'id_de_la_balise_ou tu met le score 2\').innerHTML = \''.$data['score2'].'\';';
  14. }
  15. }
  17. mysql_close();
  18. ?>


 
voila^^ j'espère que ça aideras.
Sinon bah je repasserais pour savoir si  ça marche.


Message édité par silenssin le 13-06-2011 à 13:55:08
Reply

Marsh Posté le 13-06-2011 à 14:22:58    

Plutôt que de charger les mises à jour toutes les X secondes, tu peux regarder du coté du long polling.

Reply

Marsh Posté le 13-06-2011 à 18:37:13    

Merci de ta réponse !
Je m'y essaye mais n'étant pas un expert, je ne sais guère ce qu'il faut ajouter/modifier à mes 2 seules pages actuelles :
 
Page live.php
 

Code :
  1. <body onLoad="actualiseScore();" >
  2. <?php
  3. function actualiseScore()
  4. {
  5. //connexion au fichier php.  
  6. if(text == fileLog('live2.php'))
  7. {
  8. eval(text);
  9. }
  10. //boucle tout les XXXX millièmes de secondes  
  11. setTimeout(actualiseScore, 1000);
  12. }
  13. ?>
  14.   </body><


 
Page live2.php
 

Code :
  1. <body>
  2.  
  3.  
  4. <h4>!! Match en direct !!</h4>
  6. <?php
  7. mysql_connect("**", "**", "**" ) or die("Impossible de se connecter :  " . mysql_error());
  8. mysql_select_db("**" );
  9. //Recherche du score  
  10. $query = mysql_query('SELECT score1, score2 FROM directn ORDER BY id DESC') or die (mysql_error());
  11. $data = mysql_fetch_array($query);
  13. echo'
  14. document.getElementById(\'score1\').innerHTML = \''.$data['score1'].'\';
  15. document.getElementById(\'score2\').innerHTML = \''.$data['score2'].'\';';
  17. mysql_close();
  18. ?>
  20. </body>


 
Peux-tu m'aider davantage ? Merci !

Reply

Marsh Posté le 14-06-2011 à 11:25:16    

Oublie le long polling pour l'instant, on va déjà faire marcher ton code :
dans live.php :
- Remplace les balises php <?php ?> autours de ta fonction actualiseScore par des balises script : <script type="text/javascript"></script>
- La fonction fileLog n'existe pas a priori. Il faut récupérer le contenu du fichier via ajax. Je te conseille d'utiliser jQuery.

 

Voici un exemple d'implémentation :
Fichier live.php

Code :
  1. <?php
  2.  
  3. mysql_connect("**", "**", "**" ) or die("Impossible de se connecter :  " . mysql_error());
  4. mysql_select_db("**" );
  5. $query = mysql_query('SELECT score1, score2 FROM directn ORDER BY id DESC WHERE id = ' . mysql_real_escape_string($_GET['id'])) or die (mysql_error());
  6.  
  7. $data = mysql_fetch_assoc($query);
  8.  
  9. mysql_close();
  10.  
  11. if($_GET['action'] == "actualiseScore" ){
  12. // On est dans une demande de scores
  13. // donc on renvoie les données directement
  14. die(json_encode($data));
  15. // les donnees sont au format json :
  16. // {score1:3,score2:0}
  17. }
  18. ?>
  19.  
  20. <html>
  21. <head>
  22. [...]
  23. </head>
  24. <body>
  25. <div id="score1"><?php echo $data['score1']; ?></div>
  26. <div id="score2"><?php echo $data['score2']; ?></div>
  27.  
  28. <script type="text/javascript" >
  29. var score_id = <?php echo $_GET['id']; ?>;
  30. </script>
  31. <script type="text/javascript" src="jquery.js"/>
  32. <script type="text/javascript" src="live.js"/>
  33. </body>
  34. </html>
 

// fichier live.js à inclure, necessite jquery

Code :
  1. function actualiseScore(){
  2.   $.get(
  3.     'live.php', // argument 1 : url a appeler
  4.     {action:'actualiseScore',id:score_id}, // argument 2 : données GET
  5.     function(data){ // argument 3 : fonction appelée en cas de succès
  6.       $('#score1').text(data.score1);
  7.       $('#score2').text(data.score2);
  8.  
  9.       setTimeout(actualiseScore, 1000);
  10.     },
  11.     'json' // type de donnees attendu
  12. );
  13. }
  14.  
  15. // appel de actualiseScore() au chargement
  16. $(document).ready(actualiseScore);


Message édité par Paulp le 14-06-2011 à 11:25:35
Reply

Marsh Posté le 14-06-2011 à 18:15:31    

Ok, nickel ! Je m'y essaye...
Peux-tu m'expliquer ce que je dois faire avec jquery.js ?? Ce qu'il contient ??
Javascript isn't my cup of tee ... ;-)

Reply

Marsh Posté le 15-06-2011 à 09:24:17    

c'est une librairie qui facilite beaucoup le dev js.

Reply

Marsh Posté le 16-06-2011 à 21:10:52    

Salut,
Je ne pige absolument pas ton javascript (qui est sans doute correct, mais je ne maitrise pas).
 
Certes le score s'affiche, mais ne s'actualise pas... Ton jqery.js m'est inconnu...
 
Live.php
 

Code :
  1. <?php
  2. mysql_connect("*", "*", "*" ) or die("Impossible de se connecter :  " . mysql_error());
  3. mysql_select_db("**" );
  4. //Recherche du score  
  5. $query = mysql_query('SELECT score1, score2 FROM direct, ORDER BY id DESC') or die (mysql_error());
  6. $data = mysql_fetch_array($query);
  8. mysql_close();
  10. if($_GET['action'] == "actualiseScore" ){
  11. // On est dans une demande de scores
  12. // donc on renvoie les données directement
  13. die(json_encode($data));
  14. // les donnees sont au format json :
  15. // {score1:3,score2:0}
  16. }
  17. ?>
  19. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  20. <html>
  21.   <head>
  22.   <meta http-equiv="content-type" content="text/html; charset=windows-1250">
  23.   <meta name="generator" content="PSPad editor, www.pspad.com">
  24.   <title>Match en direct</title>
  25.   </head>
  26. <body>
  27. <div id="score1"><?php echo $data['score1']; ?></div>
  28. <div id="score2"><?php echo $data['score2']; ?></div>
  30. <script type="text/javascript">
  31. var score_id = <?php echo $_GET['id']; ?>;
  32. </script>
  33. <script type="text/javascript" src="live.js" />
  34. </body>
  35. </html>


 
live.js est la même page que celle que tu m'as mentionné plus haut... Comment m'en sortir ??

Reply

Marsh Posté le 17-06-2011 à 09:56:37    

Mais cherche sur Google !
jQuery est une librairie javascript que j'utilise dans ma réponse.
C'est normal que rien ne s'actualise si tu ne l'inclues pas.

Reply

Marsh Posté le 17-06-2011 à 12:59:00    

J'ai téléchargé jquery.js, je l'ai envoyée sur le serveur, l'ai mis en rapport avec ma page live.php, je n'ai plus de problème javascript sur ma page, mais ça ne s'actualise pas automatiquement non plus...
 

Code :
  1. <?php
  2. if($_GET['action'] == "1" ){
  3. // On est dans une demande de scores
  4. // donc on renvoie les données directement
  5. die(json_encode($data));
  6. // les donnees sont au format json :
  7. // {score1:3,score2:0}
  8. }
  9. ?>
  11. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  12. <html>
  13.   <head>
  14.   <meta http-equiv="content-type" content="text/html; charset=windows-1250">
  15.   <meta name="generator" content="PSPad editor, www.pspad.com">
  16.   <title>Match en direct</title>
  17.   </head>
  18. <body onLoad="actualiseScore();" >
  20. <div id="score1"><?php echo $data['score1']; ?></div>
  21. <div id="score2"><?php echo $data['score2']; ?></div>
  23. <script type="text/javascript">
  24. var score_id = <?php echo $_GET['id']; ?>;
  25. </script>
  26. <script language="javascript" type="text/javascript" src="jquery.js" />
  27. <script type="text/javascript" src="live.js" />
  28. </body>
  29. </html>


 
live.js
 

Code :
  1. function actualiseScore(){
  2.   $.get(
  3.     'live.php', // argument 1 : url a appeler
  4.     {action:'actualiseScore',id:score_id}, // argument 2 : données GET
  5.     function(data){ // argument 3 : fonction appelée en cas de succès
  6.       $('#score1').text(data.score1);
  7.       $('#score2').text(data.score2);
  9.       setTimeout(actualiseScore, 1000);
  10.     },
  11.     'json' // type de donnees attendu
  12. );
  13. }
  15. // appel de actualiseScore() au chargement
  16. $(document).ready(actualiseScore);


 
Voilà la page de test actuelle : http://www.basketlibramont.be/live.php?action=1
 
Merci à celui qui saura m'aider...

Reply

Marsh Posté le 17-06-2011 à 12:59:00   

Reply

Marsh Posté le 17-06-2011 à 13:17:08    

Les erreurs :
- Enlève le <script type="text/javascript">var score_id = <?php echo $_GET['id']; ?>;</script> C'est un oubli
- Remplace <script language="javascript" type="text/javascript" src="jquery.js" /> et  <script type="text/javascript" src="live.js" /> par <script language="javascript" type="text/javascript" src="jquery.js"></script> et  <script type="text/javascript" src="live.js" ></script>

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed