begin process at 2010 09 09 12:50:51
  Trouver un code source :
 
dans
 
Accueil > 

Code

 > 

Divers

 > DÉTECTION JAVASCRIPT/AJAX SANS RECHARGER LA PAGE (JS/PHP)

DÉTECTION JAVASCRIPT/AJAX SANS RECHARGER LA PAGE (JS/PHP)


 Information sur la source

Note :
9 / 10 - par 1 personne
9,00 / 10

  • 1

  • 2

  • 3

  • 4

  • 5

  • 6

  • 7

  • 8

  • 9

  • 10
Catégorie :Divers Classé sous :détecter, javascript, recharger, page Niveau :Initié Date de création :28/03/2007 Date de mise à jour :28/03/2007 12:19:30 Vu :20 291

Auteur : Lomendil

Ecrire un message privé
Site perso
Commentaire sur cette source (21)
Ajouter un commentaire et/ou une note

 Description

J'ai vu qu'il y avait pas mal de monde qui cherchait un moyen de détecter si JavaScript est activé chez une personne mais sans utiliser <noscript> ou un formulaire.

!Attention! Ce script utilise JavaScript, mais aussi PHP/MySQL. Aussi, il est un peu compliqué à mettre en place si on ne maîtrise pas les différentes parties.

Source

  • //Partie JavaScript, à mettre dans le <head> de la page d'accueil du site.
  • <script language="javascript">
  • function VerifAjax(ip) {
  • var xhr_object = null;
  • if(window.XMLHttpRequest) // Firefox
  • xhr_object = new XMLHttpRequest();
  • else if(window.ActiveXObject) // Internet Explorer
  • xhr_object = new ActiveXObject("Microsoft.XMLHTTP");
  • //Méthode
  • xhr_object.open("POST", "verif_ajax.php", true);
  • //Envoi
  • xhr_object.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
  • xhr_object.send("ip="+ip);
  • }
  • </script>
  • //Dans la balise <BODY> de la page d'accueil de votre site, ajoutez l'évènement onLoad="VerifAjax('<?= get_ip() ?>')"
  • //*************************************//
  • //Partie PHP, à placer au dessus du JavaScript (Permet de connaître l'IP)
  • <?php
  • //Récupération de l'IP
  • function get_ip() {
  • if(isset($_SERVER['HTTP_X_FORWARDED_FOR'])) {
  • $ip = $_SERVER['HTTP_X_FORWARDED_FOR'];
  • }
  • elseif(isset($_SERVER['HTTP_CLIENT_IP'])) {
  • $ip = $_SERVER['HTTP_CLIENT_IP'];
  • }
  • else {
  • $ip = $_SERVER['REMOTE_ADDR'];
  • }
  • return $ip;
  • }
  • //Maintenant qu'on connait l'IP, on va maintenant pouvoir s'en servir pour mettre à jour notre table
  • $tab_stat=mysql_fetch_array(mysql_query("SELECT * FROM statistiques WHERE IP='".$ip."'")); //On regarde si l'IP est déjà dans la table
  • if(!$tab_stat) {
  • $req_stat = "INSERT INTO statistiques SET IP='".$ip."'";
  • mysql_query($req_stat); //Si elle n'y est pas, on fait une nouvelle entrée
  • }else {
  • mysql_query("UPDATE statistiques SET connexions=connexions+1 WHERE IP='".$ip."'"); //Sinon, on met à jour
  • }
  • ?>
  • //Créer maintenant un fichier verif_ajax.php, à placer dans le même répertoire que la page d'accueil.
  • //Contenu :
  • <?php
  • //Variables de connexion, à remplacer par vos paramètres
  • $sql_serveur="localhost";
  • $sql_user="login";
  • $sql_pass="pass";
  • $sql_bdd="bdd";
  • // CONNEXION MYSQL
  • $connexion = mysql_connect($sql_serveur,$sql_user,$sql_pass);
  • if (!$connexion) { die('Impossible de se connecter : ' . mysql_error());}
  • $db = mysql_select_db("$sql_bdd",$connexion);
  • $maj = mysql_query("UPDATE statistiques SET AJAX='1' WHERE IP='".$_POST['ip']."'",$connexion) or die (mysql_error());
  • //Vous pouvez placer ici un echo $maj; si vous utilisez Firebug et que vous voulez vous assurer du bon déroulement de l'opération.
  • //echo $maj;
  • ?>
//Partie JavaScript, à mettre dans le <head> de la page d'accueil du site.
<script language="javascript">
function VerifAjax(ip) {
  var xhr_object = null;

  if(window.XMLHttpRequest) // Firefox
     xhr_object = new XMLHttpRequest();
  else if(window.ActiveXObject) // Internet Explorer
     xhr_object = new ActiveXObject("Microsoft.XMLHTTP");

  //Méthode
  xhr_object.open("POST", "verif_ajax.php", true);

  //Envoi
  xhr_object.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
  xhr_object.send("ip="+ip);
}
</script>

//Dans la balise <BODY> de la page d'accueil de votre site, ajoutez l'évènement onLoad="VerifAjax('<?= get_ip() ?>')"

//*************************************//
//Partie PHP, à placer au dessus du JavaScript (Permet de connaître l'IP)
<?php
//Récupération de l'IP
function get_ip() {
    if(isset($_SERVER['HTTP_X_FORWARDED_FOR'])) {
        $ip = $_SERVER['HTTP_X_FORWARDED_FOR'];
    }
    elseif(isset($_SERVER['HTTP_CLIENT_IP'])) {
        $ip  = $_SERVER['HTTP_CLIENT_IP'];
    }
    else {
        $ip = $_SERVER['REMOTE_ADDR'];
    }
    return $ip;
}
//Maintenant qu'on connait l'IP, on va maintenant pouvoir s'en servir pour mettre à jour notre table
$tab_stat=mysql_fetch_array(mysql_query("SELECT * FROM statistiques WHERE IP='".$ip."'")); //On regarde si l'IP est déjà dans la table
if(!$tab_stat) {
	$req_stat = "INSERT INTO statistiques SET IP='".$ip."'";
	mysql_query($req_stat); //Si elle n'y est pas, on fait une nouvelle entrée
}else {
	mysql_query("UPDATE statistiques SET connexions=connexions+1 WHERE IP='".$ip."'"); //Sinon, on met à jour
}
?>

//Créer maintenant un fichier verif_ajax.php, à placer dans le même répertoire que la page d'accueil.
//Contenu :
<?php
//Variables de connexion, à remplacer par vos paramètres
$sql_serveur="localhost";
$sql_user="login";
$sql_pass="pass";
$sql_bdd="bdd";
// CONNEXION MYSQL
$connexion = mysql_connect($sql_serveur,$sql_user,$sql_pass);
if (!$connexion) {   die('Impossible de se connecter : ' . mysql_error());}
$db = mysql_select_db("$sql_bdd",$connexion);
$maj = mysql_query("UPDATE statistiques SET AJAX='1' WHERE IP='".$_POST['ip']."'",$connexion) or die (mysql_error());
//Vous pouvez placer ici un echo $maj; si vous utilisez Firebug et que vous voulez vous assurer du bon déroulement de l'opération.
//echo $maj;
?>

 Conclusion

Pour utiliser ce script, vous devez créer une table sur votre base de données MySQL avec ce code :

CREATE TABLE `statistiques` (
  `id` bigint(20) NOT NULL auto_increment,
  `IP` varchar(30) collate latin1_general_ci NOT NULL,
  `AJAX` tinyint(1) NOT NULL default '0',
  `connexions` int(3) NOT NULL default '1',
  PRIMARY KEY  (`id`)
) ENGINE=MyISAM DEFAULT CHARSET=latin1 COLLATE=latin1_general_ci;


A chaque fois qu'un visiteur va venir sur votre page, une entrée va s'insérer dans votre base de donnée avec par défaut 0 dans la colonne AJAX. Si jamais le navigateur supporte AJAX (et donc JavaScript), alors la colonne est mise à jour avec la valeur 1. Libre à vous ensuite d'utiliser cette information comme bon vous semble.

J'ai fait pas mal de retouches de mon code directement sur le site au moment où j'ai posté pour le rendre copiable plus facilement. N'hésitez pas à laisser un commentaire au cas où j'aurais oublié quelque chose ... (Après tout, ça part un peu dans tous les sens :D)


*Note* : Si vous ne voulez/pouvez pas utiliser MySQL, il est possible de remplacer la BDD par un fichier texte, je vous laisse le soin d'adapter le code ;)


 Historique

28 mars 2007 12:19:30 :
Oubli d'un bout de code ...

 Sources du même auteur

GÉNÉRATEUR D'INFO-BULLES DYNAMIQUES

 Sources de la même categorie

Source avec Zip Source avec une capture NOTATION AVEC ÉTOILES ET POSSIBILITÉ DE MODIFICATION DE LA N... par rayman223
CALCUL D'INCERTITUDE par Minilogus
Source avec Zip Source avec une capture CV EN LIGNE ORIGINAL par pops32
Source avec Zip SYSTÈME DE REQUÊTE SUR DES DONNÉES JSON par Kimjoa
Source avec Zip Source avec une capture TROUVER UN ITINÉRAIRE AVEC GOOGLE MAP par amrounix

 Sources en rapport avec celle ci

Source avec Zip Source avec une capture GOOGLE MAP API V3 CARTE, MARQUEUR, INFOWINDOWS par varfendell
DÉTÉCTER SI JAVASCRIPT EST ACTIVÉ + PHP / SESSION par ChimairaHawk
Source avec une capture PROTECTION DE CONTENU DE PAGE WEB PAR JAVASCRIPT par lucas74
IMPRESSION D UNE AUTRE PAGE A PARTIR D UN LIEN par michimanon
Source avec Zip OUVERTURE DE PAGE JUSTE À UN ENDROIT OU SUR DES DONNES PRÉCI... par abdelaziz_info

Commentaires et avis

Commentaire de bultez le 28/03/2007 11:51:00

>>un moyen de détecter si JavaScript est activé...
>>Ce script utilise JavaScript
c'est assez rigolo...
si le javascript est désactivé, il se passe quoi ?

Commentaire de Lomendil le 28/03/2007 11:56:15

Justement, il ne se passe rien. La valeur reste donc à celle par défaut -> 0
Si JS est activé, alors il se passe quelque chose (logique :D) et la valeur passe à 1.

La contrainte est qu'il faut enregistrer chaque IP dans une table, mais quand on utilise déjà un script de statistiques, ça ne pose pas de problème.

Commentaire de bultez le 28/03/2007 12:04:13

et tu la testes où cette valeur ?
dans un php qui serait appelé avec du javascript ?

Commentaire de Lomendil le 28/03/2007 12:16:01

Oui.

XMLHttpRequest appelle verif_ajax.php et met la BDD à jour. On a donc l'assurance que l'utilisation d'AJAX est possible sur le navigateur de l'utilisateur et, par déduction, JavaScript.

C'est vrai que c'est un peu en vrac comme présentation (tout à la suite ...), je ferais mieux la prochaine fois !



PS: J'ai noté un oubli de ma part, VerifAjax() doit être VerifAjax('<?=get_ip()?>'), sinon le script ne sait pas quelle ligne il doit mettre à jour !

Hop, je modifie.

Commentaire de bultez le 28/03/2007 12:32:02

>>et tu la testes où cette valeur ?
>>dans un php qui serait appelé avec du javascript ?
>Oui
d'où ma question initiale : et si le javascript est désactivé, il se passe quoi ?

Commentaire de Lomendil le 28/03/2007 12:38:00

Je dois mal m'exprimer :D

Chaque visite de la page entraine un INSERT avec l'IP du visiteur (ou UPDATE s'il existe déjà), bien sûr.
Grâce à la structure de la table (`AJAX` tinyint(1) NOT NULL default '0'), toute insertion contient 0 dans la colonne AJAX.

Si JS est désactivé, le script PHP (verif_ajax.php) n'est pas appelé et la ligne n'est pas mise à jour dans la table MySQL. Si JS et XMLHttpRequest sont disponibles, alors la ligne est mise à jour et AJAX vaut 1.

Commentaire de bultez le 28/03/2007 13:52:44


>>Je dois mal m'exprimer
mes remarques ne concernaient pas du tout le script.
pour qui me prendrais-je pour juger ?
néanmoins :
>>avec l'IP du visiteur
le commun des mortels n'a jamais qu'une IP variable
>>php..mysql...
certes... mais sur mon site, mon fai n'autorise ni l'un ni l'autre,
comme utilisateur, je désactive le javascript...
franchement : <noscript> c'est quand même plus simple, standard...

c'est plus que dommage : avec un  titre et un but étaient différents,
des choses sont à [ap]prendre dans ce script.

Commentaire de kankrelune le 28/03/2007 15:03:27

Tout comme Bultez... noscript est amplement suffisant... là tu fais des requetes SQL pour pas grand chose... qui plus est ta technique pour récupérer l'ip n'est pas fiable... tu fais comment si un internaute est derrière un proxy avec le js de désactivé un autre internaute derrière le même proxy à un navigateur ne supportant pas les xmlhttprequest et un dernier toujours derrière le même proxy à un navigateur avec javascript d'activé supportant les xhr... .. ?

C'est au niveau de tes fonctions javascript que tu dois gérer ça... .. .

par exemple

au chargement de la page tu fais ta requete ajax pour mettre à jour une variable genre...

var ajaxIsOk = false;

function VerifAjax()
{
   var xhrObj = null;

   if(window.XMLHttpRequest) // Firefox
      xhrObj = new XMLHttpRequest();
   else if(window.ActiveXObject)// Internet Explorer
   {
      try {
         xhrObj = new ActiveXObject("Msxml2.XMLHTTP");
      }
      catch (e)
      {
         try
         {
           xhrObj = new ActiveXObject("Microsoft.XMLHTTP");
         }
         catch (e1) { xhrObj = null; }
      }
   }
  
   if(xhrObj)
      ajaxIsOk = true;
}

Ensuite imaginons un lien déclenchant une fonction javascript utilisant ajax...

<a href"monFichier.php?op=pwet&action=plop" onclick="javascript: return monAction(this.href);">
  Mon Action
</a>

la fonction

function monAction(url)
{
    if(!ajaxIsOk) // ajax non supporté on renvoi true navigateur suivra le lien
        return true;
    
    // traitement de la requete ajax

    return false;// on renvoi false le navigateur ne suit pas le lien
}

Voila... c'est bien plus propre, optimisé et portable... .. .

@ tchaOo°

Commentaire de Lomendil le 28/03/2007 16:11:54

Mes contraintes à la construction de ce script étaient les suivantes :

- Pas d'utilisation de <noscript> (difficile - voire impossible ? -  à combiner à des scripts PHP).
- Pas d'intervention de la part de l'utilisateur.
- Pas de rechargement de page.
- Mise à jour d'une table de statistiques afin de connaitre la proportion de personnes pouvant voir le site dans de bonnes conditions.

A partir de là, je suis entièrement d'accord sur le fait que ce code est améliorable, surtout au niveau des cas particuliers (les proxies posent effectivement un problème, je n'y avais d'ailleurs pas pensé).

Malgré tout cela, n'hésitez pas à reprendre tout ou une partie du code pour publier une nouvelle source plus propre et correspondant à d'autres contraintes, nous sommes là pour ça.

Commentaire de bultez le 28/03/2007 16:26:20

>>difficile - voire impossible ? -  à combiner à des scripts PHP
pas compris cette affirmation ?

...
page d'accueil
<noscript>
<meta http-equiv="Refresh"
content="0; URL=pasdejavascript.php">
</noscript>
...

Commentaire de bultez le 28/03/2007 16:29:56

je viens de comprendre le sens de la phrase...
les balises <noscript> c'est du html.
c'est donc php qui peut les génèrer
ainsi que le contenu , pas l'inverse.
@+

Commentaire de stfou le 01/04/2007 13:04:29

L'idée est bonne, mais je ne vois pas l'intérêt de changer alors que noscript marche très bien.

Commentaire de MaitreJack le 02/04/2007 14:26:00

Je trouve l'exemple intéressant. Est-ce que le <noscript> n'a pas l'inconvénient de provoquer une page supplémentaire dans l'historique ? Qu'arrive-t-il lorsque l'internaute tente de reculer d'une page ?

Toutefois, pour avoir des statistiques sur la désactivation du JavaScript, je m'y prend autrement. J'ai placé un script qui crée une image invisible par DOM. Une entrée de cette image apparait dans le fichier log du serveur si le client a JavaScript actif. Cela apparaît dans mes statistiques que je fais à partir des fichiers log.

Commentaire de bultez le 02/04/2007 14:40:29


>>Est-ce que le <noscript> n'a pas l'inconvénient de  
>>provoquer une page supplémentaire dans l'historique ?
je ne pense pas... sauf s'il y a une redirection bien sûr.
et serait-ce un réel inconvénient ?

>>Qu'arrive-t-il lorsque l'internaute tente de reculer d'une page ?
la même chose qu'avec javascript installé à priori.
tu as testé ?

>>Cela apparaît dans mes statistiques que je fais à partir des fichiers log.
là d'accord, peut-être pas bête. pour des stats.
il n'y a pas "plus simple" ?
@+

Commentaire de MaitreJack le 02/04/2007 16:48:47

>> >>Est-ce que le <noscript> n'a pas l'inconvénient de  
>> >>provoquer une page supplémentaire dans l'historique ?
>>je ne pense pas... sauf s'il y a une redirection bien sûr.
>>et serait-ce un réel inconvénient ?
Je n'aime pas les redirections lorsqu'on peut l'éviter.
<noscript><meta http-equiv="Refresh" content="0; URL=pasdejavascript.php"></noscript>
L'inconvénient, c'est que l'internaute ne peut reculer d'une page avec le bouton «Précédent».
Mais ma principale question est : «Pourquoi Lomendil ne veut pas utiliser <noscript>?»

>> >>Cela apparaît dans mes statistiques que je fais à partir des fichiers log.
>>là d'accord, peut-être pas bête. pour des stats.
>>il n'y a pas "plus simple" ?

Oui, je te l'accorde. C'est un peu compliqué. Toutefois, j'ai déjà mon programme pour la compilation de mes fichiers logs et j'ai déjà un script dans ma page d'accueil pour obtenir la taille des écrans avec :
<script language="JavaScript">
document.write('<img id="log_analysis_screen_info" width="1" height="1" src="/log_analysis_screen_info.gif?' + 'width=' + screen.width + '&height=' + screen.height + '&depth=' + screen.colorDepth + '">\n');
</script>
Cela ajoute les données qui me manquaient dans mes fichiers log qui sont gérés automatiquement par le serveur Web. Bien sûr, je n'ai pas ces données si le JavaScript du client n'est pas opérationnel.
Pour moi, c'est plus simple d'ajouter quelques lignes dans mon programme de compilation des statistiques de connexion pour savoir combien n'exécute pas le JavaScript compte tenu des outils dont je dispose. Pas de SQL, juste une seule ligne javascript de la page d'accueil qui est déjà là de toute façon.

Sinon, j'aime bien la solution proposée ici.

Ma question : «Pourquoi Lomendil ne veut pas utiliser <noscript>?»

Commentaire de Lomendil le 02/04/2007 19:36:51

Tout simplement parce qu'un script PHP est executé quand il est dans une balise noscript, et ce que vous ayez ou non JS activé.

Donc quand on veut afficher du texte (HTML fixe ou dynamique avec PHP), pas de problème, mais si on veut lancer un script quand JS est activé ou pas, c'est le bazar.

La solution d'analyse des logs est sympa aussi, mais je n'y ai pas accès sur cet hébergeur de toute façon ...

Commentaire de stfou le 02/04/2007 19:49:52

Et n'y a-t-il pas un objet en PHP ou on pourrait par exemple récupérer les donées du navigateur ? (comme en javascript l'objet navigator) et voir si javascript est activé ou pas ? ainsi si il est activé on dit au script PHP d'ecrire sinon non.

Commentaire de Lomendil le 02/04/2007 19:54:57

Non, PHP ne permet pas cela.

On peut récupérer un certain nombre d'informations (User-Agent, Referer, IP, ...) mais pas si JS est activé ou non.

Je ne suis même pas sûr que ça soit possible, puisque ce type d'information n'est probablement pas envoyée au serveur.

Commentaire de stfou le 02/04/2007 20:09:39

Dommage...
Le server a ses raison que la raison ignore :)

Commentaire de Pauland le 12/10/2007 14:22:26

Je me demandais une chose moi...
Si on met une redirection par meta dans un <noscript>, il se passe quoi pour les robots?? vu qu'ils n'ont pas de JS, ils voient directement la redirection et donc passent leur chemin non ?(vu qu'il ne suivent pas la redirection)

Donc, ils font quoi ?

Commentaire de johnny57 le 14/02/2008 19:20:25

J'ai testé et amélioré un peu le script proposé, par contre je constate une "erreur" enfin façon de parler.
Si dans la page d'origine on check la bdd pour verifier si le visiteur a le js activé ou pas on aura toujours un 0 en réponse ce qui en soit est logique puisqu'on verifie la bdd avant que le script coté client ne ce lance et donc avant qu'on passe la variable à 1.
Par ailleurs quand un visiteur X arrive sur le site avec une ip I et qu'il a le js activé on aura un enregistrement à 1 dans la bdd pour cette ip.
Demain un visiteur Y arrive sur le site avec l'adresse ip I du visiteur d'hier mais lui n'a pas le JS activé, ben notre enregistrement en bdd reste à 1.
J'ai essayé de forcer la mise à 0 dans le code de la page principale pour réinitialiser la variable à chaque chargement mais du coup on ne récupère jamais la vrai valeur si dans cette même page on check la bdd pour savoir si js est activé ou pas puisqu'elle sera toujours à la valeur du reset soit 0.

 Ajouter un commentaire


Discussions en rapport avec ce code source dans le forum

HELP - RECHARGER LES FRAMES - HELP [ par Yeltaz ] Bonjour,Je recherche un script qui permette de recharger les frames d'un site lorsque l'on arrive sur une page par l'intermédiaire d'un moteur de rech recherche javascript fenetre flottante bas droit [ par redbrain ] bjr, je cherche un javascript qui permette de mettre dans une page html, une fenetre dans un coin en bas et a droite (ou s'affiche une autre page ht recharger une page [ par eax ] salutje voudrais recharger une page lorsque l'utilisateur ferme un popup comment pui je faire?merci Sylvain [email</a Recuperer le SId avec javascript [ par nikos283 ] SalutJ'ai une petit proble, voila j'ai une page php qui crée une session et j'aimerai avec javascript recupérer le nom et valeur de cette session. pou Changement d'image d'un autre frame [ par NiFF ] Ma page est séparée en 2, et il y a deux frames : je voudrais que lorsque le visiteur clique sur une image de la frame de gauche, elle s'afiche dans u JavaScript: appel du fichier externet (.js) - Help!! [ par Henri9009 ] Bonjour à tous. Je ne comprends pas comment je peux avoir un problème avec une manipulation si simple. Je vais devenir fou!!! Ça fait un Impression Javascript [ par syl2 ] Bonsoir,depuis quelques jour, j'essaye de me lancer dans l'impression d'une page en Javascript, mais sans réel résultat. En effet, si vous regarder mo petit problème en javascript ou HTML..... [ par lemuge ] bonjour,Comme vous allez le voir au travers de mes questions je suis novice, mais il faut bien commencer un jour.....Voilà mon premier problème :J'ai interagir avec le reste de la page dans une iframe [ par jesusonline ] Bonjour, dans une page j'ai une iframe et dans cette iframe j'ai du javascript, et j'aimerais savoir si c'est possible que d'à partir du javascript de impression paramétrée [ par Niles ] hello, Je ne suis pas un pro du javascript, en fait je ne connait presque rien à la conception web, je programe en C++ et en Windev. Anyway: je do


Nos sponsors


Sondage...

CalendriCode

Septembre 2010
LMMJVSD
  12345
6789101112
13141516171819
20212223242526
27282930   

Consulter la suite du CalendriCode

 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils.
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 1,186 sec (4)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales