PHP + JQuery + HTML + CSS, 1535 octets
Il s'agit d'une soumission qui penche davantage vers ce que le PO considérait comme «l'objectif réel». Autrement dit, un serveur de chat entièrement fonctionnel, qui peut être hébergé sur à peu près n'importe quel serveur Web n'importe où.
La fonctionnalité comprend:
- Notifications lorsque les utilisateurs entrent ou quittent la salle de chat.
- Notifications lorsque les utilisateurs modifient leur alias.
- Interrogation en temps réel pour les nouveaux messages, sans générer de trafic serveur excessif ni de charge serveur.
- La mise en page et la convivialité ressemblent fortement aux clients de chat existants, tels que X-Chat.
Pour être une session, entrez un alias dans la case appropriée et appuyez sur Tabou Enterpour soumettre. Si l'alias est déjà utilisé, vous en serez informé. L'envoi de messages se fait également via Enter.
Pour votre commodité, une archive de tous les fichiers peut être trouvée ici: chat.zip (choisissez Télécharger dans le menu Fichier). Pour l'installer, décompressez vers un répertoire Web sur n'importe quel serveur exécutant PHP 5.4 ou supérieur.
Mises en garde:
- IE 8 ou inférieur tournera dans une boucle infinie pendant l'interrogation, car pour une raison inconnue de l'humanité, toutes les requêtes Ajax sont mises en cache par défaut. Il vous empêche également d'envoyer deux fois le même message et de mettre à jour correctement la liste des utilisateurs. Cela pourrait être corrigé en ajoutant
cache:falseà chaque demande Ajax.
- Dans toutes les versions d'IE, les messages ne seront pas envoyés en appuyant sur Entrée, car l'
changeévénement n'est pas déclenché (en appuyant sur Tab, cependant, cela fonctionne). Cela pourrait être résolu en ajoutant un onkeypressgestionnaire, en vérifiant si la clé était Entrée, puis en appelant $(v).blur().focus().
En bref, IE n'est pas pris en charge.
Client
Le positionnement des éléments pourrait être un peu plus robuste, mais il devrait bien paraître avec une taille de fenêtre minimale d'environ ~ 800x600.
chat.htm (190 octets)
<script src=jquery.min.js></script>
<script src=c.js></script>
<link rel=stylesheet href=c.css>
<select id=u multiple></select><pre id=o></pre>
<input id=n onchange=u()><input id=v onchange=s()>
c.css (136 octets)
i{color:#999}
#u{float:right;height:100%;width:200px;margin-left:10px}
#o{border:1px solid #999;height:93%;overflow-y:scroll}
#v{width:54%}
c.js (435 octets)
var l
(function p(){
$.ajax({url:'p.php',data:{n:$('#n').val()},success:function(d){
$('#o').html(d).scrollTop(1e4);$('#u').load('n.php');
},complete:p,timeout:2e4})
})()
function s(){
$.get('s.php',{n:$(n).val(),v:$(v).val()})
$(v).val('')
}
function u(){
$.get('u.php',{l:i=l,n:l=$(n).val()}).fail(function(){
alert("This name is already in use!")
$(n).val(l=i)
})
}
$(window).on('unload',function(){$.ajax({url:'l.php',data:{l:l},async:false})})
Serveur
Je m'excuse pour le serveur étant divisé en autant de petits morceaux. L'alternative serait d'utiliser un protocole de message adéquat (via l'encodage / décodage JSON), ou d'avoir un grand if ... elseif ...en fonction des variables de post présentes. Faire des scripts séparés, une simple demande de celui dont vous avez besoin est beaucoup plus court, et peut-être plus simple que les deux.
o.php (119 octets) O stylets comme connexion à la 'base de données'
<?$m=array_slice(unserialize(file_get_contents(m)),-300);
$u=unserialize(file_get_contents(u));$t=time();extract($_GET);
c.php (57 octets) C ommet les modifications de la 'base de données'
<?foreach([u,m]as$c)file_put_contents($c,serialize($$c));
p.php (151 octets) P OLL pour les nouveaux messages
<?for($t=time();@filemtime(m)<$t;usleep(1e3))clearstatcache();include('o.php');
foreach($m as$v)if($n&&$v[0]>=$u[$n])echo@date("[H:i]",$v[0])."$v[1]\n";
s.php (62 octets) S fin un message au serveur
<?include('o.php');$m[]=[$t,"<b>$n</b>: $v"];include('c.php');
u.php (222 octets) Enregistrement de ser u ou changement d'alias
<?include('o.php');if(!trim($n)||$u[$n])exit(header('HTTP/1.1 418'));
$m[]=[$t,$u[$l]?
"<i><b>$l</b> is now known as <b>$n</b>.</i>":
"<i><b>$n</b> has entered the chat.</i>"];
$u[$n]=$u[$l]?:$t;unset($u[$l]);include('c.php');
n.php (65 octets) Récupère la liste des utilisateurs n ames
<?include('o.php');foreach($u as$k=>$v)echo"<option>$k</option>";
l.php (98 octets) L'utilisateur a l eft (fermé son navigateur)
<?include('o.php');$m[]=[$t,"<i><b>$l</b> has left the chat.</i>"];
unset($u[$l]);include('c.php');
