Comment faire ?(impossible à formuler sans un exemple)

[ToniConti]

Bonjour à tous,

Après plusieurs tentatives échouées je me dis que le plus simple est de commencer mon explication par un exemple :

Code :

1
2
<script priority="1" type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js" > </script>
<script priority="2" type="text/javascript" src="https://serveurDansLeReseau/libs/jquery-ui.min.js" > </script>

L'attribut "priority" n'existe pas par contre il me permet d'exprimer ce que je voudrais arriver à faire.
En gros l'idée serait de pouvoir lire une librairie depuis le site google pour alléger le trafic réseau, mais si la connexion internet du client ne fonctionne pas, switcher vers une lecture de la librairie depuis un emplacement sur le réseau.

Est-ce possible et comment faire ?

Merci à tous pour vos lumières

[mekal]

tu cree une variable apres le chargement de la page tu fait un teste de cette variable si elle existe c'est que le fichier a ete charge si ce n'est pas le cas il suffira de modifier le src de la balise script

[RomainVALERI]

Envoyé par ToniConti

Comment faire ?(impossible à formuler sans un exemple)

"Comment faire pour accéder dynamiquement à un script externe ?"

---

Autre chose : as-tu anticipé le problème de Same Origin Policy ? (le fait que l'accès à un domaine différent ne puisse se faire que par l'intermédiaire de ton serveur)

>>> en tout cas a priori il me semble que le choix du script devrait se faire soit à la génération de la page, soit par ajax, mais de toutes façons côté serveur... non ? ^^

[nault]

Salut jai un debut de solution peut-etre,

voici le code :

javascript :

Code :

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
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
 
	<script language="javascript" type="text/javascript" >
		var xmlHttpReq = false;
		if (window.XMLHttpRequest) {
			xmlHttpReq = new XMLHttpRequest();
		}
		else if (window.ActiveXObject) {
 
			xmlHttpReq = new ActiveXObject("Microsoft.XMLHTTP");
		}
 
		function addJS(file,i){
			length = file.length
 
			var cfile = file[i]
 
			self.xmlHttpReq.open('POST', 'detectFile.php', true);
			self.xmlHttpReq.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
			self.xmlHttpReq.onreadystatechange = function() {
				if (self.xmlHttpReq.readyState == 4) {
					if(self.xmlHttpReq.responseText == 'true'){
 
						 creerJStag(cfile)
					}else{
						if(i<length){
 
							addJS(file,i+1);
						}else{
 
 
						}
					}
				}
			}
			self.xmlHttpReq.send('file='+cfile);
			return false;
		}
 
		function monCallback(){
			alert($('body'));						 
		}
 
		function creerJStag(src){
		 var baliseHead = document.getElementsByTagName("head")[0];
		  var nouveauScript=document.createElement('script')
		  nouveauScript.setAttribute("language","javascript")
		  nouveauScript.setAttribute("type","text/javascript")
		  nouveauScript.setAttribute("onLoad","monCallback()")
		  nouveauScript.setAttribute("id","script")
		  nouveauScript.setAttribute("src", src)
		  nouveauScript.onLoad = monCallback
		  baliseHead.appendChild(nouveauScript)
 
		}
 
		addJS(['ddd','https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js'],0);
 
</script>

le php :

Code :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
 
<?php
 
 
$contenue = @file_get_contents($_POST['file']);
 
if(empty($contenue)){
	echo 'false';
	die();
}
 
$response = '';
 
foreach($http_response_header as $v){
	$response .= $v	;
}
 
if(!preg_match('#javascript#',$response)){
	echo 'false';
	die();
}
	echo 'true';
 
?>

explication :

Code :

addJS(['ddd','https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js'],0);

on envoie 2 parametre, un array contenant la liste de js a charger, et 0 qui ca servir d'iterateur pour la recursivite

addJS() va en boucle effectuer une requete ajax vers le script php. le script php detecte si le fichier existe et si cest du javascrip, il renvoie 'true' ou 'false';

addJS() va donc passer a travers sont array recu en parametre jusqua ce quil trouve le fichier correspondant, une foi trouver il va executer creerJStag()

creerJStag() recoit comme parametre le src du fichier Js et creer une balise et la place dans le head

si tu regardes dans l'attribut onLoad, je met un callback, cela sert a m'assurer que le js est charger avant de l'utiliser.

Bon jai fait ca vite pour le fun, si javais a utiliser ce script jaurais un bon travail doptimisation a faire. Ce n'est donc pas la version la optimal qui soit.

note : je n'ai tester que sous ff 3.6

[RomainVALERI]

joli exemple bravo

@ToniConti : tu as besoin d'avoir la compatibilité IE6 ?

[nault]

Oui meme si l'exemple peut marché en théorie je réitére de pas l'utiliser,

apres 2-3 test, je m'appercoit que le temps de reponse dans onreadystatechange de mon httprequest est vraiment trop long et prive lutilisateur de $(window).ready et . onLoad...

et aussi, le php utiliser dans lexemple à lui seul suffit. mais comment la question etait si ca se fait en javascript jme suis amuser un peu.

Je me demande tout de meme sans requete ajax si cest fesable car jarrive a recuper quand quand le script est charger en assigant un callback a onLoad mais je ne peux pas savoir si le script est inchargeable.

peut etre mettre un while qui attend le onload pendant un lapse de temp et passer au prochain js si il se passe rien, mais sa limplique encore de faire attendre le bon déroulement du script pour donner suite et gruger du temps de loading de lutilisateur.

donc a moi davis contraire Je prétend que la seul bonne facon est avec un script serveur

[RomainVALERI]

Envoyé par RomainVALERI

>>> en tout cas a priori il me semble que le choix du script devrait se faire soit à la génération de la page, soit par ajax, mais de toutes façons côté serveur... non ? ^^

Envoyé par nault

donc a moi davis contraire Je prétend que la seul bonne facon est avec un script serveur

On est donc bien d'accord

Toni ? quel est ton langage serveur actuel ? (si tu en utilises déjà un ici bien sûr ^^)

[dukej]

Si tu héberge ton site il doit être lui-même capable d'héberger ses fichiers JS.
C'est jolie que google propose un hébergement des fichiers, mais du coup tu es dépendant d'un tiers sur un service "gratuit" et comme il est gratuit google peut couper à tout moment les JS.

Personnellement je préfère ne faire confiance à moi même et si j'ai un gros site je passe par une solution de CDN via akamai par exemple. En tout cas je ne ferai pas confiance à un site gratuit. Et sinon le reste, reste du bricolage.

[SpaceFrog]

alt ne fonctionne pas sur une balise script ? vu que c'est un src...

[ToniConti]

Bonjour à tous,

Merci pour vos réponses, je me rend compte que c'est pas si simple que ça !
Je ne suis encore que novice en programmation internet...

Je vais tenter de répondre à vos questions :

@ToniConti : tu as besoin d'avoir la compatibilité IE6 ?

Firefox suffira nos utilisateurs sont de toutes façon obligés d'utiliser Firefox ^^

Toni ? quel est ton langage serveur actuel ?

Caché (InterSystem Caché)

as-tu anticipé le problème de Same Origin Policy ?

Non je n'imaginais pas que ce problème existait ^^

En tout cas je ne ferai pas confiance à un site gratuit.

Attention c'est pas tout à fait une hébergement gratuis tel qu'on peut s'y attendre c'est plutot des api que google héberge de manière publique je pense que c'est déjà un peu plus stable quand même ^^ d'ailleurs avec ce post j'espère pouvoir anticiper les éventuelles interruptions de service côté toile

-------------------------------------

Il y a peut être une information qui pourrait aider (et qui sait simplifier le problème ^^) c'est que les scripts en question sont les librairies JQuery suivantes ainsi qu'une page css :

Code :

1
2
3
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"> </script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.7/jquery-ui.min.js"> </script>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.7/themes/smoothness/jquery-ui.css" type="text/css" />

Donc a priori il faudrait que je vérifie si les trois fichiers ont été chargés, si pas faire le nécessaire pour les charger depuis un emplacement réseaux.
Je vais tenter d'implémenter les solutions proposées mais si vous avez d'autres suggestions je suis preneur

Encore merci pour vos réponses,
Bonne journée à tous