Discussion :

[WhoIsTiti]

Bonjour à la communauté,
Je débogue un moteur de recherche écrit en javascript (dont je ne suis l'auteur).
En voici le contexte:
C'est une documentation d'un script php généré par un script perl avec une sortie en arborescence de 3500 fichiers. La présentation est généré en fichiers html accessibles aussi bien en local (comme un document) qu'en distant.
Il y a deux frames : une pour un tree menu en js(name=nav), une autre pour l'affichage du contenu(name=docview).
Le moteur de recherche , qui se situe dans la frame docview, avant modification amené vers des pages 404 (voir une erreur d'exception sous firefox) car il ne vérifiait pas la présence des fichiers.(car les entrées utiilsateur sont des recherches de fichiers)
Je me suis donc tourné vers le langage AJAX pour arriver à mes fins.
Voici la partie utile du code que j'ai écris :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
 
xhr = null;
follow = null;
//ajout : vérification asynchrone que le fichier existe !
function searchfile(file){
  //la variable 'file' est un chemin relatif !
  if ( window.XMLHttpRequest ) { xhr = new window.XMLHttpRequest();
  }else{
  if ( window.ActiveXObject )  { xhr = new window.ActiveXObject( "Microsoft.XMLHTTP" );
  }else{
  throw "plateforme non supportée";
    }
  }
  if ( !xhr ){throw "erreur !";} 
  xhr.open( "HEAD", file, true )
   try{
     xhr.send(null);
     }
     catch (e){
     alert('requête erronée');//seul Firefox en local capte l'erreur -> domaine file:///
     }         
     xhr.onreadystatechange = function(){        
     // la requête est revenue et la page existe :     
     if(xhr.status != 404 && xhr.readyState == 4){
     // on va sur la page de résultats.
     window.location.href = file;
     // si la page n'existe pas :
     }else if(xhr.status == 404){     
     // on le signale dans le champs !     
     document.forms['search'].searchtext.value = 'valeur erronée !'; 
     location.reload();        
     }
     // si erreur, on n'ajoute pas la recherche dans le cookie !
     follow = xhr.status;           
     };    
}

la fonction searchfile étant appelé dans une autre :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
 
// la variable target est l'entrée du user
// la variable globale relbase est le chemin relatif du dossier
function jumpFunction(target) {    
    var target=target.replace(/[()]/g,'');    
    target=target.toLowerCase(); 
    file = relbase+'_functions/'+escape(escape(pesc(target)))+ext;
    searchfile(file);
// la fonction logFunction ajoute l'entrée dans un cookie.   
    if (follow != null) logFunction(target);    
}

et voici le code du formulaire :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
 
<script language="JavaScript" type="text/javascript">
<!--   
    document.writeln('<div class="searchfox">');
    document.writeln('<table class="searchfoxtable"><tr><td class="searchfoxtitle">Recherches :<\/td><td class="searchfoxhistorik"><a href="javascript:showSearchPopup()">Historique</a><\/td><\/tr><\/table>'); 
    document.writeln('<form name="search" onsubmit=\'return jump()\'>');    
    document.writeln('<input type="text" class="searchfoxtext" name="searchtext" size="30" value="" onfocus="javascript:this.value=\'\';this.style.textDecoration=\'none\';this.style.color=\'white\';">');
    document.writeln('<input type="submit" class="searchfox-button" value="recherche"><br />');    
    document.writeln('<input type="radio" name="choix" value="1" checked><a  href="_classes/index.html">Classe<\/a>'); 
    document.writeln('<input type="radio" name="choix" value="2"><a  href="_functions/index.html">Fonctions<\/a>');
    document.writeln('<input type="radio" name="choix" value="3"><a  href="_variables/index.html">Variables<\/a>');
    document.writeln('<input type="radio" name="choix" value="4"><a  href="_constants/index.html">Constantes<\/a>');
    document.writeln('<input type="radio" name="choix" value="5"><a id="funcsearchlink" href="_tables/index.html">Tables<\/a>'); 
    document.writeln('<\/form>');     
    document.writeln('<\/div>');
    // -->
</script>

le fonctionnement normal du moteur :
->la requête vérifie si l'entrée de l'utilisateur est un fichier valide dans le dossier destinataire (5 choix possibles via des boutons radio)
|-> si oui, on renvoit sur la page html et on ajoute l'entrée au cookie.
|-> si non, on reste sur la page actuelle, on signale l'erreur dans le champs recherche et on n'ajoute pas l'entrée dans le cookie.

-> le moteur de recherche fonctionne tout à fait normalement si ma documentation est en localhost (sur wamp, donc avec un domaine en http://localhost/doc)

Je ne rencontre que des dysfonctionnement en local lorsque la barre d'adresse du navigateur affiche : file:///.....
tous navigateurs confondus :

• voici les tests effectués :
• test 1: l'ajax ne fonctionne pas.
• test 2: Mais si l'entrée de l'utilisateur est correcte, on est bien redirigé vers la bonne page (sauf pour Internet Explorer 8 qui ne fait rien, feigniasse )
• test 3 :si l'entrée de l'utilisateur est incorrecte :
  Sous Firefox : Mon test d'erreur try/catch fonctionne et le script s'arrête.
  Sous Google Chrome & opera, le test d'erreur reste sans effet & j'ai des retours 404.
  Sous Safari : le chargement de page s'arrête, la barre d'état signale un fichier non trouvé (normal)

J'arrive au bout de mes connaissances d'autodidacte pour finir le débogage du code. je sais qu'il existe une propriété de l'objet window qui pourrait me servir pour jouer avec des conditionnelles (en l'occurrence, document.location.protocol pour test file:///), mais avant de coder, j'aimerais connaître votre avis, avoir des pistes.
Merci de votre patience, c'était un peu long ...
A+
W

edit: correction du code.

[E.Bzz]

Bonjour,

Merci de votre patience, c'était un peu long

aucun problème !
C'est largement préférable au très synthétique "Aidez-moi, ça marche pas !!"

Bon, désolé, j'ai pas le temps de regarder tout en détail

Par contre, tu pourras peut-être éliminer quelques bugs (suivant le nav) en remplaçant

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

window.location = file;

par

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

window.location.href = file;

qui est la syntaxe correcte.
Celle que tu utilises, bien qu'erronée (c'est bien la propriété href de location qui contient l'url), est comprise par certains navigateurs. Par contre, elle génère peut être certaines des erreurs que tu constates ....

A+

[WhoIsTiti]

Merci E.Bzz de te pencher sur mon souci.
La piste que tu me donnes ne change pas le comportement des navigateurs.
Je me demande si il n'y aurait pas des restrictions de 'sécurité' sur les navigateurs avec des url de type 'file:///'.
J'avais découverte celle ci : ecriture-lecture-local-cookie-google-chrome/
et comme chacun y va de son paramétrage, c difficile de s'y retrouver. (Entre autre,je prend une alerte sécurité sous IE7)
Néanmoins, j'ai tout de même découvert dans mon code un dysfonctionnement avec IE 7 & 6, qui je pense, est dû au :
(1er traitement du formulaire)

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
 
function jump() { 
  if (document.search.searchtext.value.length){  
	for (i=0;i<document.forms['search'].choix.length;i++) {  
		if (document.forms['search'].choix[i].checked) {
			 choix = document.forms['search'].choix[i].value;
	   }
	}	
	 searchentry = document.forms['search'].searchtext.value;   
  			switch(choix){      
          case "1": jumpClass(searchentry);
          break;     
          case "2": jumpFunction(searchentry);
          break;
          case "3": jumpVariable(searchentry);
          break;
          case "4": jumpConstant(searchentry);
          break;
          case "5": jumpTable(searchentry);      
         }    
  }
  return false;
}

en particulier :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

searchentry = document.forms['search'].searchtext.value;

qu'il va falloir que je remplace par un getElementById ...

Bref, je stagne ...


edit: après vérification, l'analyse du dom est bon, l'alerte sécurité est dû à l'appel ajax sous protocole file. Alerte supprimée avec un simple :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
 
try{
  xhr.open( "GET", file, true )
  }
  catch(e){}

[Bovino]

Salut,

J'ai surtout l'impression que ton problème vient du fait que tu fais une requête HEAD sans serveur, du coup, pas d'en-tête HTTP (à l'envoi comme au retour) et donc des comportements aléatoires en fonction des navigateurs.

[WhoIsTiti]

Bovino:
j'y avais pensé. mais que ce soit GET ou HEAD, le problème est identique.
Trouvé sur http://msdn.microsoft.com :

The native XMLHTTPRequest object only permits HTTP and HTTPS urls (regardless of zone) and permits only the following HTTP methods: "GET", "POST", "HEAD", "PUT", "DELETE", "MOVE", "PROPFIND", "PROPPATCH", "MKCOL", "COPY", "LOCK", "UNLOCK", "OPTIONS".

IE7's object allows only requests to the same port; IE8's object removes that restriction.

Donc pour mon protocole file:///, je peux me brosser ! IE (6, 7 || 8) désactive l'ajax.Par manque de confiance dans la sécurité de leur browser ?

Bref, tous les navigateurs gèrent ce protocole à l'emporte piece, et je ne suis pas le seul à la constater :
http://www.mail-archive.com/public-w.../msg04834.html
Ce n'est pas mon code qui foire (puisqu'il marche sur un serveur) mais les navigateurs qui font des caprices ... je l'apprends à mes dépends. (faudra peut être le mettre dans la faq, si quelqu'un un jour bute sur un problème identique au mien ... )

Je pense qu'on peut mettre le sujet en [résolu], même si foncièrement il ne l'est pas.