Astuces de Webmaster

Tout est là : http://googletesting.blogspot.com/2009/05/yet-another-javascript-testing.html

Un outil qui teste vos JS sur tous les navigateurs, magnifique

Voici le système que j’utilise aujourd’hui pour le suivi de mes serveurs dédiés. Il s’agit d’un système très simple composé des briques suivantes :
- Dernière version de PHPWatch (voir le site)
- API SMS - Bêta - By Orange (Accéder à l’API Manager - voir notamment le lien dans le menu de gauche API SMS)
- Quelques modifications sur le cron pour l’envoi d’e-mails.

De base, cela ne monitore que si les services Apache (si on regarde le port 80 / http) sont up ou down et non si les pages sont fonctionnelles (on ne verra pas les erreurs PHP mais on va pouvoir trouver des solutions pour cela.. bientôt)

Chaque SMS envoyé coûtera 10 centimes débités sur le compte. Soit le prix d’un SMS que vous envoyez avec n’importe quel mobile.

0. Allez sur l’interface API SMS d’Orange, inscrivez-vous, créditez votre compte de 10€ pour le test (cochez éventuellement la case renouvellement automatique) et dans l’onglet “key”, notez bien votre clé API.
1. Mettez en ligne le script (cliquez ici pour télécharger) sur un serveur autre que celui que vous souhaitez monitorer et allez à son adresse en ajoutant /install/ à la fin et suivez les instructions (attention, il n’y a pas d’espaces de nom sur les tables…)
2. Allez dans la table “logs” et ajoutez une colonne “message”. Elle servira à reccueillir lors d’un problème un arrêté de l’e-mail envoyé. Cela peut toujours servir.
3. Ouvrez le fichier cron.php qui se trouve à la racine du répertoire PHPWatch et insérez le code suivant en lieu et place de l’existant :

<?php
// A qui on envoie des SMS en cas de problème ?
$contactsMonitoringSMS=Array(
‘RomainMobile’=>’33679241180′,
‘CollegueMobile’=>’336XXXXXX’,

);
// A qui on envoie un mail en cas de problème ? (en parallèle)
$contactsMonitoringEMAIL=Array(
‘RomainPerso’=>’monemail@gmail.com’
,’ServiceInformatique’=>’monemailpro@maboite.com’
);

define(’PATH_TO’, ‘./’);
require_once(PATH_TO . ‘common.php’);

$all = ServiceChecker::getReport();

foreach($all as $monitors)
{
foreach($monitors as $monitor)
{
$monitor['derniereFoisOffline']=date(”d/m/Y H:i:s”,$monitor['last_offline']);
// print_r($monitor);
if(!$monitor['online'])
{
$message = $monitor['host'] . ‘ HORS LIGNE. NOTIFICATIONS ENVOYEES. (/!\\ PHASE DE TEST, A VOIR SI C FIABLE)’;
echo $message;

foreach($contactsMonitoringSMS as $prenom=>$numero) {
$phone_number = $numero;
$contactsEmail=”"; foreach($contactsMonitoringEMAIL as $prenom=>$email) $contactsEmail.=” [".$prenom."] “;
$contactsSMS=”"; foreach($contactsMonitoringSMS as $prenom=>$numero) $contactsSMS.=” [".$prenom."] “;

// attention, on coupe le message à 155 caractères
$sms=$monitor['host'].” HS - SMS : “.$contactsSMS.” - @ : “.$contactsEmail;
if(strlen($sms)>159) $sms=substr($sms,0,154).’[...]‘;
$text_message = urlencode($sms);
$api_access_key = ‘dexxxx5ac’; // Mettez votre clé API - disponible sur l’API Manager
$url = “http://sms.alpha.orange-api.net/sms/sendSMS.xml?id=$api_access_key&to=$phone_number&content=$text_message”;
$response = file_get_contents($url);
$xml = simplexml_load_string($response);
echo “Status: “,$xml->status->status_msg;

}
foreach($contactsMonitoringEMAIL as $prenom=>$email) {
$to = $email;
$subject = $message;
ob_start();
echo $message;
echo “\nE-mails envoyes a :\n”;
print_r($contactsMonitoringEMAIL);
echo “\nSMS envoyes a :\n”;
print_r($contactsMonitoringSMS);
echo “\nDetails Erreur :\n”;
print_r($monitor);
$msg=ob_get_contents();
ob_end_clean();
$headers = ‘From: Roms Monitoring ‘.”\r\n”;
//$headers .= ‘Bcc: Moi ; lui ‘.”\r\n”;
$headers .= “\r\n”;
mail($to, $subject, $msg, $headers);
}
NotificationHandler::sendNotifications($monitor);
}

$requete=’INSERT INTO logs (monitor, timestamp, online, message) VALUES
(’ . $monitor['id'] . ‘, ‘ . time() . ‘, ‘ . ($monitor['online'] ? 1 : 0) . ‘, \”.addslashes($msg).’\')’;
$GLOBALS['PW_DB']->query($requete);
}
}
?>

4. Créez le cron qui va bien dans le crontab si vous avez un serveur dédié (autre que celui monitoré évidemment - en faisant un wget http://www.monsite.com/repertoirePHPWatch/cron.php).
Si vous avez un mutualisé chez OVH (type 60gp, 90plan,…), vous pouvez aller dans votre manager OVH, rubrique “Mutualisé” > “Hébergement” > Planificateur de tâches et créer une tâche qui lance le fichier cron.php chaque heure.
Si vous n’avez ni l’un ni l’autre, vous avez toujours WebCron.org ou ça..
Ou bien, si vous avez des amis qui ont un dédié, c’est le moment de les solliciter, c’est pas bien méchant un cron..
Réserves : attention, il s’agit d’une première version de développement, tous les composants sont en phase bêta. Vous aurez remarqué également que lorsqu’on dit dans le message envoyé “NOTIFICATIONS ENVOYEES”, on n’a pas vérifié que c’était effectivement le cas… Par ailleurs, on peut imaginer monitorer l’état réel d’un script en jouant avec les entêtes renvoyées ou avec des contenus de la page. Pour l’instant, cette version me convient.

Tous retours d’expérience bienvenus pour compléter ce tutoriel.

A voir, un plug-in Jquery permettant un tri et une pagination dynamique. Je trouve ça énorme.

A diffuser !

Le lien : http://www.sprymedia.co.uk/dataTables-1.4/media/js/jquery.dataTables.js
Doc & démo : http://www.sprymedia.co.uk/dataTables-1.4/example_zero_config.html
La source : http://www.dator.fr/une-datagrid-avec-jquery-gerant-le-trie-et-la-pagination/

A tester : CrossBrowserTesting.com

CrossBrowserTesting.com propose une approche différente en offrant la possibilité de tester ses sites non seulement sur tous les navigateurs du marché, y compris les plus confidentiels ou les versions les plus récentes comme IE8, mais également sur toutes les versions de tous les systèmes d’exploitation, Windows (incluant Windows 7), Mac OS et Linux, le tout quelque soit votre machine, et sans rien installer à part une machine virtuelle Java, normalement déjà présente sur votre PC.

(source : presse-citron.net)

http://www.codeproject.com/KB/aspnet/LocalizedSamplePart2.aspx#databasedesign

http://jqueryui.com/themeroller/
http://mochaui.com/demo/

MochaUI vous propose une interface toute prête, adaptable, flexible, qui vous permet rapidement de mettre en place un canevas ergonomique pour tout back-office (par exemple).

JQueryUI vous donne tous les éléments d’interface sous forme modulaire, et vous laisse créer la présentation vous-mêmes.

Microsoft vient de sortir un outil à suivre : SuperPreview

Il permet pour l’instant de comparer les différences de rendus entre les différentes version d’Internet Explorer mais déclare ajouter bientôt les navigateurs concurrents.

Limites vues par Raphaël d’Alsacreations :

Microsoft a déjà fait part de certaines limitations :
• Les filtres et transitions ne sont pas disponibles sur le moteur IE6, ce qui ne permet pas de traiter les PNG transparents avec DXImageTransform.
• Les éléments positionnés via fixed peuvent ne pas être affichés correctement.
• Les tags object, embed et applet peuvent ne pas être affichés avec les bonnes dimensions si IE8 n’est pas installé.
• Les pages vues avec le moteur d’IE6 et utilisant JavaScript pour modifier leur contenu pourraient… ne pas s’afficher comme dans l’IE6 original, car le script sera interprété comme il le serait dans IE7 ou IE8.
Ajoutons à cela que les fonctionnalités sont tout de même très en-deçà de celles proposées par Firebug et ses équivalents pour Safari et Chrome - dans l’état actuel du développement. Télécharger 250 Mo si les comportements ne sont pas garantis comme dans les versions authentiques, cela reste discutable. La licence de cette beta expirera le 1er octobre 2009.

(source : http://www.alsacreations.com/actu/lire/685-microsoft-expression-web-superpreview.html

A suivre donc

Première chose à faire : contrôler les autres services du serveur (est-ce uniquement lié à un nom de domaine ou est-ce le serveur qui est en panne). S’il n’y a pas d’autres sites sur le même serveur, il y a peut-être un phpMyAdmin, Munin ou autre Webmin à tester ?

Si c’est le domaine qui ne répond pas
1. Faire un ZoneCheck pour voir si les DNS sont correctement configurés : http://www.afnic.fr/outils/zonecheck/zc.cgi?zone=guide-sensations.com
1.a si ça vous répond qu’il y a un problème avec les SOA, c’est qu’il y a un problème dans les réponses SOA de votre serveur : à voir dans les BIND ou dans les configurations & RNDC (named.conf, named.conf.options,…)
1.b si ça cherche les DNS et que ça met que les zones ne sont pas cohérentes, il faut vérifier 3 points : les DNS bien configurés chez le registrar (ovh, gandhi, bookmyname, amen,…), le reverse bien défini pour les serveurs dédiés (ovh pour l’exemple : Manager OVH > Services > DNS Secondaires), et les SOA bien définis sur le serveur (Serveur BIND à configurer) dans les 3 cas, l’IP et les NS (primaire et secondaires) doivent correspondre. Un dig (http://www.webmaster-toolkit.com/dig.shtml?address=guide-sensations.com) vous aidera à vérifier la configuration en cours.
1.c une fois une modif faite, ça peut prendre du temps à se répercuter (jusqu’à 6 jours chez Orange..), il faut tester chez plusieurs FAI autant que possible pour voir si ça commence à se propager ou pas et faire quelques nslookup pour tester depuis les serveurs souhaités si la propagation se fait bien (windows : exécuter > cmd > nslookup). Exemple
# nslookup
# > server 212.216.212.112 (tester les IP par FAI à cette URL : http://www.commentcamarche.net/faq/sujet-1496-serveurs-dns-des-principaux-fai)
# > guide-sensations.com
et là ça vous sortira l’IP qui est prévu pour ce nom de domaine suivant la propagation des infos sur ce serveur là et donc vous aurez les infos de propagation par FAI.
1.d vérifiez à cette adresse : http://www.zonecut.net/dns/ avec un bon visuel que tout est ok.

Si c’est le serveur qui est en panne

1. Tester les services les uns après les autres et les restarter s’ils sont tombés
2. à côté, il est bon d’être connecté en SSH et de faire un tail -f /var/log/syslog pour voir ce qu’il se passe et l’erreur éventuelle qui se produit (avec le fichier et la ligne de l’erreur avec un peu de chance)
3. N’oubliez pas de faire un fcsk de temps en temps

Alsacreations est un très bon site que vous connaissez probablement.

Je vous conseille comme à moi-même d’aller régulièrement faire un petit quizz au hasard, on apprend toujours quelque chose, c’est ça qui est bon

Ici : http://www.alsacreations.com/quiz/

Petit instantané (on verra l’évolution au fil du temps :))
Moyenne Joueurs
XHTML débutant 5.9 1155
XHTML moyen 5.6 596
XHTML difficile 4.5 610
XHTML difficile (bis) 4.9 442
CSS débutant 9.1 886
CSS moyen 4.7 604
CSS difficile 3.3 446
JS / DOM débutant 6.3 305
JS / DOM moyen 4.7 204
JS / DOM difficile 3.4 207
Accessibilité 7.3 260
PHP débutant 8 799
PHP moyen 5.9 655
PHP difficile 5.6 634
PHP difficile (bis) 2.9 459

Tout au long de l’évolution d’un site Internet, on doit faire évoluer la structure technique de façon à pouvoir absorber le trafic et diminuer les risques qui deviennent de plus en plus coûteux.

Je vous invite à lire cet excellent article du site haute-disponibilite.net qui reprend un document de présentation d’une société spécialisée.

http://www.haute-disponibilite.net/2008/09/25/planning-des-evolutions-de-votre-architecture-web/

C’est un début et c’est une proposition, ça a le mérite d’exister.