JDNet | Solutions | Emploi | Votre high-tech
 
Linternaute | Copainsdavant
Séminaires & Evénements | Etudes
   

Rechercher  

 
Sociétés Prestataires Carnet Formations Progiciels Encyclo Fonds Guide d'achat Comparateur Téléchargement Livres
Actualités
   2003
   2002
   2001
   Livres
Rubriques
   Java/J2EE
   PHP
   XML
   Client Web
   Technos .NET
   Flash
   Algo/Méthodes
   Outils

Dossiers
   Tous les dossiers

   PHP, Flash, SVG
   Perl / CGI - SSI
   Langages Web
   Services Web
   Sécurité
Ressources
   Interviews

   Téléchargement
   Composants
   Documentation
Contacts
   Rédaction
   Webmaster
© Benchmark Group

Les principes du "remote scripting"
Au lieu de recharger la page web à chaque intéraction avec le serveur, il est possible d'effectuer des appels de scripts "distants" au sein, par exemple, d'un élément IFRAME. Introduction à la technique du "remote scripting".

L'un des principaux défauts du protocole HTTP est la nécessité, en cas d'intéractions complexes (le paiement en ligne, par exemple, ou un processus d'identification) entre le client (le navigateur) et le serveur, de créer une série de pages web séparées, chaque page étant dédiée au traitement d'une requête envoyée au serveur. Pour l'utilisateur, l'approche est également imparfaite, car le chargement (ou l'actualisation) des pages est source de ralentissement, d'une part, et surtout d'interruption de la continuité de l'application mise en place.
Il est pourtant possible de s'affranchir du chargement (ou de l'actualisation) d'une page lorsque le client communique avec le serveur. C'est le principe du "remote scripting", que l'on peut traduite par "appel de scripts distants", sans que cette dénomination ne décrive très bien la réalité de la technique: il faut la comprendre comme l'analogue web des (ou tout du moins une forme d') appels de procédures à distance (RPC), où une "procédure distante" (dans notre cas, sur le serveur web) s'éxécute de manière transparente (dans notre cas, sans recharger ou actualiser la page) pour l'utilisateur.

La méthode

Pour mettre en oeuvre du "remote scripting", il faut bien sûr, côté client, un peu plus que le "simple" langage HTML: on utilisera ainsi, par exemple, le JavaScript. La méthode comporte donc l'inconvénient de reposer sur l'activation (ou plutôt la non désactivation) de ce langage par l'utilisateur dans les paramètres de son navigateur. Notons qu'il est aussi possible de reposer sur d'autres techniques, notamment les applets Java, les contrôles ActiveX, ou encore les animations Flash et bien sûr XML-RPC et le protocole SOAP.

Dans la suite de cet article, nous allons tirer profit de l'élément IFRAME, partie intégrante des spécifications HTML depuis la version 4 du langage, et correctement implémenté par la plupart des navigateurs récents. Notre IFRAME fonctionnera en conjonction avec un script côté serveur, et du code JavaScript côté client.

La technique est la suivante: nous allons définir un élément IFRAME "invisible", faisant appel à un fichier HTML "fantôme", de la manière suivante:

<IFRAME name="RemoteScripting"
                  width="0" height="0" border="0"
                  src="blank.html">
</IFRAME>

Le fichier "blank.html" n'a en général pas besoin d'exister réellement. Pour être parfaitement rigoureux, vous pouvez néanmoins le créer en y insérant seulement le code <HTML></HTML> (par exemple).
On réalisera ensuite l'appel de procédure à distance en envoyant des données de formulaire à un script dont le code HTML produit en sortie est dirigé vers notre IFRAME:

<FORM action="process.php" target="RemoteScripting" method="POST">

Dans notre fichier process.php, nous traiterons les données transmises par la requête HTTP associée à la soumission du formulaire.

Où intervient le Javascript? Il va nous permettre d'afficher le résultat du script "process.php" hors de l'élément IFRAME.

Exemple

Pour être plus clair, prenons l'exemple suivant: nous transmettons, via un formulaire dirigé vers un élément IFRAME, deux valeurs à un script php qui en fait la somme. Ce script contient en outre du code JavaScript qui va faire appel à une fonction définie dans notre page web initiale (celle qui contient l'élément IFRAME).
Cette fonction sera définie comme suit (entre les balises <HEAD>...<SCRIPT language="JavaScript"> et </SCRIPT>...</HEAD>):

function TraiteReponse(valeur){
  document.getElementById("AfficheReponse").innerText=valeur;
}
(Cette fonction modifie dynamiquement le contenu "texte" à l'intérieur des balises dont l'identifiant est "AfficheReponse")

tandis que, au sein de "process.php", on écrira (la page web contenant l'élément IFRAME vers laquelle est dirigé le code HTML en sortie du script étant la "fenêtre parente" de la "fenêtre IFRAME"):

<script language="JavaScript">
window.parent.TraiteReponse('<? echo $valeur?>');
</script>

$valeur est une variable PHP qui contient le résulat de la somme des deux valeurs transmises par le formulaire suivant, défini dans notre page web initiale:

<FORM action="/exemples/process.php" method="POST" target="RemoteScripting">
Entrer un premier nombre: <INPUT type="text" name="nb1" size="5"><BR>
Entrer un deuxième nombre:<INPUT type="text" name="nb2" size="5"><BR>
<INPUT type="submit" value="ok" name="submit">
</FORM>

Ainsi, "process.php" contiendra les lignes:

<?
$valeur=$nb1+$nb2;
?>

(et le code JavaScript mentionné plus haut)

Enfin, on repèrera, dans notre page web initiale, l'élément HTML dont on modifie le contenu "texte" en fonction de la réponse du serveur. Par exemple, on écrira:

Somme: <div id="AfficheReponse"></div>

Le résultat est alors le suivant:

Entrer un premier nombre:

Somme:

Entrer un deuxième nombre:

 

Si l'on récapitule, l'ensemble du code donné plus haut figure dans la page web qui contient l'élément IFRAME. Ce code se compose de:
- la fonction JavaScript "TraiteReponse()"
- le formulaire
- l'élément IFRAME
- la balise dont l'identifiant est "somme"
Dans "process.php" (le fichier côté serveur), on a le code:

<?
$valeur=$nb1+$nb2;
?>

<script language="JavaScript">
window.parent.TraiteReponse('<? echo $valeur?>');
</script>


L'exemple donné est très simple, et peut être programmé sans passer par un script PHP, mais directement en JavaScript. Si les traitements sont beaucoup plus complexes (appel à une base de données, etc.), l'approche par "remote scripting" et éléments IFRAME devient pertinente, et la méthode sera la même que celle décrite plus haut. Seul le code PHP (et non le code JavaScript) du fichier "process.php" changera (ainsi que, bien sûr, les éléments de formulaire à transmettre).

Notons pour finir que notre méthode peut causer certains problèmes lorsque l'utilisateur appuie sur les boutons "Précédent" et "Actualiser" de son navigateur. La solution réside dans la création de l'élément IFRAME non plus dans le code HTML mais via le code JavaScript (de la page initiale). Un exemple illustrant la puissance du "remote scripting" ET la création d'un élément IFRAME via Javascript peut être consulté à l'URL suivante:

http://www.oreillynet.com/javascript/2002/02/08/examples/load_static.html

[Jérôme Morlon, 19 mars 2001 , JDNet]

Gratuit - Les nouveautés de
JDNet Développeurs
Toutes nos newsletters
 

Quel est le meilleur langage pour aborder la programmation ?
Basic (VB & co...)
C/C++
Java/C#
PHP
Pascal/Delphi
Perl
Python
autre...



Les outils de développement dans le Guide des Solutions
e-business

L'encyclopédie JDNet Toutes les notions pratiques, techniques et économiques relatives à l'e-business.
>> Accès à la rubrique "Développement"

Comparez les prix Matériel, PDA, modems...
Les bonnes affaires de la high-tech avec Kelkoo.
>> Comparateur

Société | Contacts | Publicité | Presse | Recrutement | Tous nos sites | Données personelles
Pour tout problème de consultations, écrivez au Webmaster.
© Benchmark Group, 4 rue diderot 92156 Suresnes Cedex