Formulaires avec les méthodes PUT et DELETE en HTML 4.01 (partie 2/2)

Exemple d’utilisation

Dans ce document, on va voir comment utiliser ces deux méthodes.

Pour commencer, seules les méthodes GET et POST sont supportées et traitées de la même manière par tous les navigateurs. Les spécifications HTML jusqu'à 4.01 ne définissent aucun support PUT/DELETE pour les formulaires, et seulement GET et POST sont supportés. Du fait que ces deux méthodes PUT/DELETE sont de plus en plus utilisées, HTML 5 définit une spécification pour PUT/DELETE.

En dehors d’HTML 5, un navigateur qui respecte strictement la spécification w3c [3] de HTML ne supporte pas PUT et DELETE, et c'est la valeur GET qui est envoyée par défaut si la méthode n'est pas reconnue.

L'exemple suivant illustre bien ce problème.


<body>
<h1>Hello World!</h1>
<form action="restTest" method="PUT">
<input type="text" name="NOMBRE" value="" />
<input type="submit" value="PUT" />
</form>
</body>

Figure 1. Formulaire avec méthode PUT en HTML 4.0

L'exemple illustre un simple formulaire avec un champ texte et un bouton. L'analyse des requêtes échangées lors du clic sur le bouton prouve que la méthode est GET.

Figure 2. Analyse des requêtes HTTP échangées

Étudions maintenant l'exemple suivant. On associe au bouton, lorsqu'on clique dessus, une action définie en JavaScript.


function putrequest()
{
xhr=window.ActiveXObject ? new ActiveXObject("Microsoft.XMLHTTP") : new XMLHttpRequest();
xhr.onreadystatechange=function(){//TODO...};
xhr.open("PUT","http://localhost:8084/rest/restTest");
xhr.send(null);
}

Figure 3. Méthode PUT avec l'objet XMLHTTPRequest

Nous définissons la requête à travers l'objet XMLHTTPRequest et nous spécifions la méthode PUT. Le but ici est de vérifier bien que le serveur d'application Apache Tomcat gère et accepte bien les requêtes PUT et DELETE.

Figure 4. Analyse des requêtes HTTP échangées (PUT avec XMLHTTPRequest)

L'objet XMLHTTPRequest fait appel à la servlet restTest, où est redéfinie la méthode doPost. HTTP Analyser (HTTPFox pour Firefox) montre bien que la méthode PUT est supportée par l'objet XMLHTTPRequest et le serveur Tomcat a bien exécuté la méthode doPost.

La servlet RestTest appelée détecte la méthode PUT et fait appel à la méthode doPut redéfinie dans la servlet. L’implémentation par défaut de doDelete et doPut ne fait que rendre des messages.

Or, un tel appel ne reflète pas vraiment une méthode PUT ou DELETE et peut être remplacé par un appel POST ou GET. En effet ces deux méthodes servent à insérer, mettre à jour ou supprimer des ressources.

Modifions le code précédent de la manière suivante:


<script type="javascript">

function putrequest()
{
xhr=window.ActiveXObject ? new ActiveXObject("Microsoft.XMLHTTP") : new XMLHttpRequest();
xhr.onreadystatechange=function(){//TODO...};
xhr.open("PUT","http://localhost:8084/rest/welcome.html");
xhr.send("<html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>JSP Page</title></head><body><h1>Hello World!</h1></body></html>");
}
</script>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>JSP Page</title>
</head>
<body>
<h1>Hello World!</h1>
<button onclick="putrequest">PUT</button>
</body>
</html>

Figure 5. Ajout d'une nouvelle ressource

Dans cet exemple, on spécifie l’URI de la ressource demandée (welcome.html à ajouter). Comme on n’a pas défini aucune correspondance entre l’url demandée et une servlet, tomcat fait appel à la servlet par défaut (DefaultServlet [4]) pour servir les ressources. Cette servlet redéfinit les méthodes doPut et doDelete pour effectuer le traitement nécessaire. Le corps de la nouvelle page à ajouter est envoyé dans par la méthode send. La spécification w3c pour l’objet XMLHTTPRequest définit le type des données envoyées par la méthode send comme étant document ou string.

Figure 6. Réponse à une méthode PUT

Pour des raisons de sécurité, Tomcat ne permet pas par défaut la manipulation des ressources. Ainsi, le serveur génère une erreur 403 liée aux droits de modification. Pour activer ce mode, il faut mettre le paramètre readonly de la servlet par défaut à false (modification du fichier web.xml dans le dossier conf).

Figure 7. Configuration du fichier web.xml

Il sera mieux de définir notre propre servlet qui s’inspire de DefaultServlet et bien configurer le fichier web.xml propre à notre application pour définir la correspondance entre cette servlet et le pattern des URI. Il faut aussi penser à créer des contraintes de sécurité pour les ressources (authentification et rôle dans web.xml).

Figure 8. Analyse des requêtes HTTP échangées (PUT avec XMLHTTPRequest)

La page est bel est bien crée dans cet exemple et on peut directement y accéder en tapant l’url y correspondant. Le code de retour est 201 si la ressource est créée, et 204 si elle est mise à jour.

Pour utiliser PUT et DELETE dans un formulaire en HTML 4, on peut définir une action JavaScript associée au bouton et qui récupère les différents champs et envoie la requête correspondante.

[3] HTML4.01 specification for the form element.

[4] Default Servlet Reference.

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Captcha *

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.