Dans ce chapitre, nous allons commencer à réaliser notre application web. Nous allons débuter par une partie sur le fonctionnement de HTTP. Je vais prendre le temps de revenir sur la méthode doGet
de HttpServlet
. Nous réaliserons ensuite un formulaire de saisie.
Notre application
Notre application va se composer d'un formulaire permettant la saisie d'une facture :

Le formulaire n'est pas pratique, mais, pour notre exercice, il sera largement suffisant. Si vous comprenez la démarche pour créer un formulaire simple comme celui-ci, vous serez capable de créer tout type de site web. Pour en apprendre plus sur l'expérience utilisateur, un cours est présent sur OpenClassrooms.
En validant, la facture est générée :

GET
On va commencer par générer une nouvelle classe héritant de HttpServlet
appelée BillServlet
.
package com.cursan.homeshop.web;
import javax.servlet.http.HttpServlet;
public class BillServlet extends HttpServlet {
}
On ajoute le mapping de cette Servlet
avec l'URL /bill
dans web.xml.
<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd"
version="3.1">
<servlet>
<servlet-name>Bill</servlet-name>
<servlet-class>com.cursan.homeshop.web.BillServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>Bill</servlet-name>
<url-pattern>/bill</url-pattern>
</servlet-mapping>
</web-app>
On surcharge la méthode init
et doGet
de BillServlet
.
package com.cursan.homeshop.web;
import javax.servlet.http.HttpServlet;
public class BillServlet extends HttpServlet {
@Override
public void init() throws ServletException {
super.init();
}
@Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
super.doGet(req, resp);
}
}
À quoi servent ces 2 méthodes exactement ?
init
: C'est la méthode qui va être appelée par Jetty quand il va instancier un objet de typeHttpServlet
. Cette méthode est utilisée une fois au début. Elle permet d'initialiser le contexte. Nous allons nous en servir pour générer la liste des produits disponibles.doGet
: Si vous reprenez le message HTTP du cours précédent, il commençait parGET /page.html HTTP/1.0 ...
.GET
est un verbe HTTP. Il signifie "donne-moi telle page". La méthodedoGet
dans lesHttpServlet
sert à gérer les messages de type GET. Il existe plusieurs verbes HTTP qui peuvent être gérés via les méthodes associées (POST →doPost
, PUT →doPut
, etc.).
Quand votre navigateur charge une page web, il a la possibilité de rajouter des paramètres libres.
http://www.mapage.com?param1=value1¶m2=value2
On a :
http://
→ on précise qu'on utilise HTTPwww.mapage.com
→ le nom de domaine?
→ on commence la liste des paramètres par?
param1
→ le nom du premier paramètre=
→ on assigne une valeur àparam1
value1
→ la valeur assignée&
→ on sépare chaque paramètre avec&
On recommence pour chaque paramètre.
On peut récupérer dans doGet
les paramètres en faisant req.getQueryString()
. Cette méthode retourne une chaîne de caractères contenant l'ensemble des paramètres. S'il n'y a pas de paramètre, la méthode retourne null
.
On va procéder ainsi :
On vérifie s'il y a des paramètres ou non.
S'il n'y en a pas, on affiche le formulaire.
L'utilisateur saisit les informations et valide le formulaire.
Cette action actualise la page en ajoutant des paramètres (les valeurs du formulaire).
Cette fois-ci, il y a des paramètres ; on affiche donc la facture correspondante.
Le formulaire
Commençons par la première étape :
@Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
resp.setContentType("text/html");
if (req.getQueryString() == null)
displayForm(resp);
else
displayBill(req, resp);
}
La première ligne resp.setContentType("text/html");
précise que l'on va utiliser du HTML pour notre réponse. Ensuite, on regarde s'il y a des paramètres présents. En fonction, on affiche le formulaire ou la facture.
Pour générer le formulaire, il faut la liste des produits (elle est affichée avant le formulaire). Nous allons nous servir de la méthode init
pour cela.
public class BillServlet extends HttpServlet {
List<Product> products = new ArrayList<Product>();
@Override
public void init() throws ServletException {
Product cafe = new Product("Philips HD7866/61", "Philips SENSEO Quadrante, Noir - 1 ou 2 tasses", 79.99);
Product tv = new Television("TV Samsung UE49MU6292", "Smart TV LED incurvée 49\"", 599, 49, "LED");
Fridge fridge = new Fridge("BEKO TSE 1042 F", "Réfrigérateur BEKO 130L - Classe A+ - blanc", 189, 130, false);
products.add(cafe);
products.add(tv);
products.add(fridge);
}
...
}
On va pouvoir utiliser products
dans displayForm
pour afficher les produits.
private void displayFrom(HttpServletResponse resp) throws IOException {
for (int i = 0; i < products.size(); i++) {
Product product = products.get(i);
resp.getWriter().println(
"<b>" + i + " - " + product.getName() + "</b> : " + product.getPrice() + "<br/>" +
product.getDescription() + "<br/><br/>");
}
String form = "<form action=\"bill\">" +
"<b>nom complet :</b> <input name=\"fullname\"/><br/>" +
"<b>adresse :</b> <input name=\"address\"/><br/><br/>" +
"<b>livraison :</b> <br/>" +
"à domicile : <input type=\"radio\" name=\"deliveryMode\" value=\"direct\"/><br/>" +
"express : <input type=\"radio\" name=\"deliveryMode\" value=\"express\"/><br/>" +
"point relais : <input type=\"radio\" name=\"deliveryMode\" value=\"relay\"/><br/>" +
"à retirer : <input type=\"radio\" name=\"deliveryMode\" value=\"takeAway\"/><br/>" +
"<b>Informations livraison</b> (relay et express) : <input name=\"deliveryInfo\"/><br/><br/>" +
"<b>liste produits </b> (produit:quantité, un produit par ligne) : <br/>" +
"<textarea name=\"products\"></textarea><br/>" +
"<input type=\"submit\"/>" +
"</form>";
resp.getWriter().println(form);
}
Dans la boucle, on affiche les produits.
<b>valeur</b>
sert à mettre en grasvaleur
en HTML.<br />
sert à faire un retour à la ligne en HTML.On affiche ensuite le formulaire.
Allez sur la page http://localhost:8080/bill.
Votre formulaire s'affiche :soleil: !