Discussion :

[yassinbean]

Bonjour,

J'aurai besoin d'une balise <script> que je doit modifier selon les entrées des utilisateurs.
J'ai essayé avec cette exemple pour tester:

Code :

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

1
2
3
4
5
6
7
8
9
10
var head1 = document.getElementsByTagName("head")[0];         
var Script1 = document.createElement('script');	
Script1.type = 'text/javascript';
//Script1.src = 'CodeJS/conversion-distance/conversion-distance.js';
//Script1.innerHTML = 'function fvar(x) {return(5*x);}' ;
Script1.textContent = 'function fvar(x) {return(5*x);}' ;
head1.appendChild(Script1);
alert(fvar(5));
Script1.textContent = 'function fvar(x) {return(10*x);}' ;		
alert(fvar(5));

Le problème, c'est que la modification du contenu de Script1 n'est pas pris en compte, c'est la premier contenu qui est utilisé. Est ce qu'il y a moyen de mettre à jour le contenu de l'élément Script ?.
J'ai essayé aussi avec la suppression et l'ajout d'un node, mais I.E n'est pas à l'aise avec appendchild..

C'est quoi la meilleur façon de procéder à votre avis

Merci d'avance

[Auteur]

bonsoir,

J'aurai besoin d'une balise <script> que je doit modifier selon les entrées des utilisateurs.

peux-tu préciser ton idée ?

[yassinbean]

Sans abuser de l'utilisation de eval() !

[yassinbean]

C'est pour calculer par exemple f(x) , f est la fonction que va entrer l'utilisateur

[Auteur]

un petit exemple, sans eval() :

Code javascript :

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 clic()
{
	var t = document.getElementById("strFct");
	var balise;
	var code;
	var idx;
 
 
	balise  = document.createElement("script");
	balise.type = "text/javascript";
	code = t.value;
	balise.innerHTML = code;
 
	document.getElementById("bscript").appendChild(balise);
 
	idx = code.indexOf("{");
	code = code.substring(9, idx);
 
	document.getElementById("fct").innerHTML = "<input type='button' value='Exécuter fonction' onclick='" + code + "'/>";
 
 
}

Code html :

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

1
2
3
4
5
6
7
8
9
10
11
12
 
<textarea id="strFct" style="width:200px; height:100px">function plop(){
x=3;
alert(x+5);
}</textarea>
<br/>
<input type="button" onclick="clic()" value="Valider" />
</br>
 
<div id="fct"></div>
 
<div id="bscript"></div>

[marcha]

@auteur

Pourquoi n'utilise-tu pas simplement eval ?

Si c'est par soucis de sécurité, ta proposition n'est pas plus sure.

[Auteur]

@auteur
Pourquoi n'utilise-tu pas simplement eval ?
Si c'est par soucis de sécurité, ta proposition n'est pas plus sure.

J'aurai pu utiliser eval effectivement. J'ai même été tenté d'utiliser l'objet Function() mais :

Sans abuser de l'utilisation de eval() !

Ensuite, pour revenir sur le point de la sécurité, j'avoue que je n'ai jamais bien compris en quoi eval() n'était pas sûre car pour moi cette fonction est exécuté côté client. Je crois aussi que l'objet Function() n'est pas plus sûr également.

[marcha]

eval peut être dangereux dans certains cas.

Par exemple si il y avait un champs login dans la même page que ce textarea de calcul de fonction. Tu pourrai écrire un script dans ce textarea qui gère
l'évènement keypress sur le champs login et envoie une requête avec le username password qui serait saisi dedans.

Tu va vers une personne qui a un compte sur le site, et depuis son pc tu colle ce code dans le textarea, ensuite tu lui laisse la place et si il se logue tu lui as usurpé son mot de passe à son insu.

Cet exemple est un peu tiré par les cheveux dans ce cas précis. La dangerosité d'eval dépend beaucoup du contexte dans lequel elle est utilisée.

Ce qui est très dangereux c'est d'utiliser eval pour évaluer un paramètre de l'url. Ceci permettrait d'envoyer un url à quelqu'un avec un script dedans.

[Auteur]

Merci pour cette information L'objet Function() présente le même danger je crois car il fait appel à eval() également si je ne me trompe pas ?

[marcha]

L'objet Function permet d'accéder aux prototypes et d'y ajouter / modifier des methodes dynamiquement. Ce qui permet par exemple de modifier le code d'un objet existant, par exemple tu pourrais modifier: String.charAt() et faire quelques petites manipulations malicieuses dedans tout en conservant son comportement normal.

Là où je vois de la dangerosité c'est que dans un site que tu développes tu incorpore une librairie utilitaire virusée qui modifie les prototypes de certains objets et que tes appels à charAt lui permettent d'obtenir des informations sur les String que tu manipules.

Le mélange de eval et de Function peut être terrible car on pourrait imaginer modifier les prototypes des objets javascript sur la base de code extérieur au site.

[SylvainPV]

Que l'on utilise eval(code), onclick="code", Function("code") ou encore setTimeout("code") ça revient au même : on appelle le moteur de compilation pour évaluer dynamiquement du code potentiellement issu d'un utilisateur mal intentionné. Donc ce sont les mêmes tenants et aboutissants qu'eval, comme l'a bien décrit marcha

[marcha]

Pour en revenir à la question de départ, la solution la plus simple à programmer consiste à utiliser une des techniques décrites qui ont toutes le danger de l'évaluation sous-jacente. Si la sécurité n'est pas primordiale autant utiliser ça.

Deux autres idées si il faut plus de sécurité:

1) Utiliser une technique basée sur eval mais avec une vérification du code avant son évaluation. Par exemple en utilisant une expression régulière qui valide que le code corresponds bien à une expression attendue.

2) Utiliser une fonction d'évaluation maison. Celle-ci consiste à effectuer un parsing de l'expression puis de l'organiser en arbre autour des opérateurs suivant leur priorité et enfin de faire le calcul opérateur par opérateur récursivement dans l'arbre.

@yassinbean Quelle est la complexité des opération à évaluer ?

[yassinbean]

Salut les amis,
Merci bq pour la discussion et vos conseils pertinents; on s'approche du but

Ce que je cherche à faire ressemble au calculatrice scientifique;

Par exemple, l'utilisateur va taper: x= 2; f(x)= cos(x^2)+log(x)
et moi je dois analyser la chaine " cos(x^2)+log(x) "
pour calculer f(2);...

Le 2ème problème à régler, est de trouver le meilleur algo pour vérifier la chaine entrée par l'utilisateur. ça fera l'objet de mon prochain sujet.

Je suis d'accord que ça ressemble à l'utilisation de eval();

Mais, tout de même, ça m'énerve ne pas comprendre pourquoi le navigateur ne met pas à jour l'élément script après changement. Pour la solution avec appendchild, sous internet explorer ça bug ..

[yassinbean]

Merci amigos,
Au prochain sujet, et Bravo