Shoutbox en ajax et format UTF8 non pris en compte [Résolu/Fermé]

Signaler
Messages postés
65
Date d'inscription
jeudi 1 décembre 2016
Statut
Membre
Dernière intervention
21 août 2018
-
Messages postés
65
Date d'inscription
jeudi 1 décembre 2016
Statut
Membre
Dernière intervention
21 août 2018
-
Bonjour,


Je cherche une petite shoutbox pour mon site web et je suis tombé sur un vieux mais bon petit projet open source.Le but est de faire une shoutbox très simple sans MySQL.

Tout va bien mais le problème concerne l'affichage des messages avec caractères spéciaux (ç é è)...

Je mets le code ci-dessous, comme vous pouvez le voir utf8 est bien mentionné dans le html, je pense que c'est du coté d'ajax que ça coince car quand j'ouvre mon fichier chat.txt avec mousepad il me dit que celui-ci n'est pas en utf8 par défaut.

Code de index.html:

<!DOCTYPE html>
<html lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<style type="text/css">
body { padding-left:40px; background:#57767F; font-family:arial;}
input, textarea { font-family: courier new; font-size: 12px; }
#content { width:800px; text-align:left; margin-left:60px; }

#chatwindow { border:1px solid #aaaaaa; padding:4px; background:#232D2F; color:white;}
#chatnick { border: none; border-bottom:1px solid #aaaaaa; padding:4px; background:#57767F;}
#chatmsg { border: none; border-bottom:1px solid #aaaaaa; padding:4px; background:#57767F; }

#info { text-align:left; padding-left:0px; font-family:arial; }
#info td { font-size:12px; padding-right:10px; color:#DFDFDF; }
#info .small { font-size:10px; padding-left:10px; padding-right:0px; }

#info a { text-decoration:none; color:white; }
#info a:hover { text-decoration:underline; color:#CF9700; }
</style>
</head>
<body>
<div id="info">
<br>
<table border="0">
<tr>
<td colspan="2">
<a href="/projects/most-simple-ajax-chat-ever/"><font style="font-size:14px">most simple ajax chat</a> (v3)</font><br>
</td>
</tr>
<tr>
<td class="small">author</td>
<td class="small"><a href="mailto:chris@linuxuser.at">chris at linuxuser dot at</a></td>
</tr>
<tr>
<td class="small">home</td>
<td class="small"><a href="/projects/most-simple-ajax-chat-ever/">www.linuxuser.at</a></td>
</tr>
<tr>
<td class="small">source</td>
<td class="small"><a href="https://github.com/metachris/most-simple-ajax-chat-ever">Github</a></td>
</tr>
<tr><td> </td></tr>
<tr>
<td colspan="2" class="small">toggle: <a href="#" onclick="javascript:show_newmsg_on_bottom=!show_newmsg_on_bottom">top/bottom display</a> | <a href="#" onclick="javascript:chatwindow.style.fontWeight= (chatwindow.style.fontWeight=='bold') ? 'normal' : 'bold';">bold</a></td>
</tr>
</table>

</div>
<br>
<div id="content">
<textarea id="chatwindow" rows="19" cols="95" readonly></textarea><br>

<input id="chatnick" type="text" size="9" maxlength="10" placeholder="username"> 
<input id="chatmsg" type="text" size="80" maxlength="80" onkeyup="keyup(event.keyCode);" placeholder="message">
<input type="button" value="add" onclick="submit_msg();" style="cursor:pointer;border:1px solid gray;"><br><br>
</div>

</body>
</html>

<script type="text/javascript">
/* most simple ajax chat script (www.linuxuser.at) (GPLv2) */
var nick_maxlength=10;
var http_request=false;
var http_request2=false;
var intUpdate;

/* http_request for writing */
function ajax_request(url){http_request=false;if(window.XMLHttpRequest){http_request=new XMLHttpRequest();if(http_request.overrideMimeType){http_request.overrideMimeType('text/xml');}}else if(window.ActiveXObject){try{http_request=new ActiveXObject("Msxml2.XMLHTTP");}catch(e){try{http_request=new ActiveXObject("Microsoft.XMLHTTP");}catch(e){}}}
if(!http_request){alert('Giving up :( Cannot create an XMLHTTP instance');return false;}
http_request.onreadystatechange=alertContents;http_request.open('GET',url,true);http_request.send(null);}
function alertContents(){if(http_request.readyState==4){if(http_request.status==200){rec_response(http_request.responseText);}else{}}}

/* http_request for reading */
function ajax_request2(url){http_request2=false;if(window.XMLHttpRequest){http_request2=new XMLHttpRequest();if(http_request2.overrideMimeType){http_request2.overrideMimeType('text/xml');}}else if(window.ActiveXObject){try{http_request2=new ActiveXObject("Msxml2.XMLHTTP");}catch(e){try{http_request2=new ActiveXObject("Microsoft.XMLHTTP");}catch(e){}}}
if(!http_request2){alert('Giving up :( Cannot create an XMLHTTP instance');return false;}
http_request2.onreadystatechange=alertContents2;http_request2.open('GET',url,true);http_request2.send(null);}
function alertContents2(){if(http_request2.readyState==4){if(http_request2.status==200){rec_chatcontent(http_request2.responseText);}else{}}}

/* chat stuff */
chatmsg.focus()
var show_newmsg_on_bottom=1; /* set to 0 to let new msg´s appear on top */
var waittime=1000; /* time between chat refreshes (ms) */

intUpdate=window.setTimeout("read_cont();", waittime);
chatwindow.value = "loading...";

function read_cont() { zeit = new Date(); ms = (zeit.getHours() * 24 * 60 * 1000) + (zeit.getMinutes() * 60 * 1000) + (zeit.getSeconds() * 1000) + zeit.getMilliseconds(); ajax_request2("chat.txt?x=" + ms); }
function display_msg(msg1) { chatwindow.value = msg1.trim(); }
function keyup(arg1) { if (arg1 == 13) submit_msg(); }
function submit_msg() { clearTimeout(intUpdate); if (chatnick.value == "") { check = prompt("please enter username:"); if (check === null) return 0; if (check == "") check="..."; chatnick.value=check; } if (chatnick.value.length > nick_maxlength) chatnick.value=chatnick.value.substring(0,nick_maxlength); spaces=""; for(i=0;i<(nick_maxlength-chatnick.value.length);i++) spaces+=" "; v=chatwindow.value.substring(chatwindow.value.indexOf("\n")) + "\n" + chatnick.value + spaces + "| " + chatmsg.value; if (chatmsg.value != "") chatwindow.value=v.substring(1); write_msg(chatmsg.value,chatnick.value); chatmsg.value=""; intUpdate=window.setTimeout("read_cont();", waittime);}
function write_msg(msg1,nick1) { ajax_request("w.php?m=" + escape(msg1) + "&n=" + escape(nick1)); }
function rec_response(str1) { }

function rec_chatcontent(cont1) {
if (cont1 != "") {
out1 = unescape(cont1);
if (show_newmsg_on_bottom == 0) { out1 = ""; while (cont1.indexOf("\n") > -1) { out1 = cont1.substr(0, cont1.indexOf("\n")) + "\n" + out1; cont1 = cont1.substr(cont1.indexOf("\n") + 1); out1 = unescape(out1); } }
if (chatwindow.value != out1) { display_msg(out1); }
intUpdate=window.setTimeout("read_cont()", waittime);
}
}
</script>


Code de write.php (w.php):


<?php
header('Content-typ: content="text/html; charset=UTF-8');
/**
  • Author: chris at linuxuser.at * Licence: MIT */ $fn = "chat.txt"; $maxlines = 200; $nick_maxlength = 10; /* Set this to a minimum wait time between posts (in sec) */ $waittime_sec = 0; /* spam keywords */ $spam[] = "cum"; $spam[] = "dick"; $spam[] = "EAT coon"; /* IP's to block */ $blockip[] = "72.60.167.89"; /* spam, if message IS exactly that string */ $espam[] = "ajax"; $msg = $_REQUEST["m"]; $n = $_REQUEST["n"]; if ($waittime_sec > 0) { $lastvisit = $_COOKIE["lachatlv"]; setcookie("lachatlv", time()); if ($lastvisit != "") { $diff = time() - $lastvisit; if ($diff < $waittime_sec) { die(); } } } if ($msg != "") { if (strlen($msg) < 2) { die(); } if (strlen($msg) > 3) { /* Smilies are ok */ if (strtoupper($msg) == $msg) { die(); } } if (strlen($msg) > 150) { die(); } if (strlen($msg) > 15) { if (substr_count($msg, substr($msg, 6, 8)) > 1) { die(); } } foreach ($blockip as $a) { if ($_SERVER["REMOTE_ADDR"] == $a) { die(); } } $mystring = strtoupper($msg); foreach ($spam as $a) { if (strpos($mystring, strtoupper($a)) === false) { /* Everything Ok Here */ } else { die(); } } foreach ($espam as $a) { if (strtoupper($msg) == strtoupper($a)) { die(); } } $handle = fopen ($fn, 'r'); $chattext = fread($handle, filesize($fn)); fclose($handle); $arr1 = explode("\n", $chattext); if (count($arr1) > $maxlines) { /* Pruning */ $arr1 = array_reverse($arr1); for ($i=0; $i<$maxlines; $i++) { $arr2[$i] = $arr1[$i]; } $arr2 = array_reverse($arr2); } else { $arr2 = $arr1; } $chattext = implode("\n", $arr2); // Last spam filter: die if message has already been in the chat history if (substr_count($chattext, $msg) > 2) { die(); } $spaces = ""; if (strlen($n) > $nick_maxlength-1) $n = substr($n, 0, $nick_maxlength-1); for ($i=0; $i<($nick_maxlength - strlen($n)); $i++) $spaces .= " "; $out = $chattext . $n . $spaces . "| " . $msg . "\n"; $out = str_replace("\'", "'", $out); $out = str_replace("\\\"", "\"", $out); $handle = fopen ($fn, 'w'); fwrite($handle, $out.trim()); fclose($handle); }?>



Merci de m'éclaircir sur ce problème d'encodage.


2 réponses

Messages postés
30258
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
21 novembre 2020
3 000
Bonjour,
Commence par regarder le chapitre 1 de ce lien :
https://www.commentcamarche.net/faq/47069-html-php-caracteres-accentues-et-l-utf8

Messages postés
65
Date d'inscription
jeudi 1 décembre 2016
Statut
Membre
Dernière intervention
21 août 2018

Bonjour,

J'utilise gedit et mousepad en éditeur de texte , j'ai cherche un peu dans les options sans trouver ou se trouve par défaut l'encodage avec utf-8.

Quand j'ouvre mon fichier chat.txt (fichier qui stocke les messages) avec mousepad j'ai le droit a ce message, je vous le met en image c'est plus simple que d'expliquer: https://www.zupimages.net/up/18/12/67jf.png

Dans mon html j'ai bien ceci dans l'head:
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>


Dans mon php j'ai placé un header en 1er ligne, sans résultat non plus apparemment:
header('Content-Type: text/html; charset=utf-8');
Messages postés
65
Date d'inscription
jeudi 1 décembre 2016
Statut
Membre
Dernière intervention
21 août 2018

Je viens de m'apercevoir en enregistrant mes fichier shoutbox en utf-8 que mon fichier chat.txt se remet en iso8859-1 a chaque message envoyé, il ne garde pas l'enregistrement au format utf-8 puisque a chaque fois que je l'ouvre pour le ré enregistrer je vois iso-8859-1 qui apparait comme format par défaut...

Je précise que j'ai bien placé un header indiquant utf-8 en 1er ligne du script php, donc je vois pas d'ou ça peut venir.

Voici un retour de la comande file:

file -i *
chat.txt: text/plain; charset=iso-8859-1
index.html: text/html; charset=utf-8
w.php: text/x-php; charset=us-ascii
Messages postés
30258
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
21 novembre 2020
3 000
Pour écrire ton fichier, utilises l'instruction file_put_contents en forçant l'éncodage
https://www.php.net/manual/fr/function.file-put-contents.php

par exemple :
$data = mb_convert_encoding($TexteAEnregistrer, 'UTF-8', 'OLD-ENCODING');
file_put_contents($chemin_vers_fichiers, $data);
Messages postés
65
Date d'inscription
jeudi 1 décembre 2016
Statut
Membre
Dernière intervention
21 août 2018

Excuse ma nulitée en php mais je dois placer ce morceau de code ou exactement ?

Voici la fin du fichier php qui traite les données.


$out = $chattext . $n . $spaces . "| " . $msg . "\n";
$out = str_replace("\'", "'", $out);
$out = str_replace("\\\"", "\"", $out);
$handle = fopen ($fn, 'w'); fwrite($handle, $out.trim()); fclose($handle);
}

?>