MVC dans JSP (Architecture)

Par : James Hartmann James Hartmann
Hours Le kit de préparation mis à jour

Qu'est-ce que MVC?

MVC est une architecture qui sépare la logique métier, la présentation et les données. Dans MVC,

  • M signifie Modèle
  • V signifie Vue
  • C signifie contrôleur.

MVC est un moyen systématique d'utiliser l'application où le flux démarre à partir de la couche de visualisation, où la demande est générée et traitée dans la couche contrôleur et envoyée à la couche modèle pour insérer des données et récupérer le message de réussite ou d'échec. Le MVC ArchiLe diagramme de configuration est représenté ci-dessous :

MVC Architecture
MVC Archidiagramme de structure

Couche de modèle

  • Il s'agit de la couche de données qui constitue la logique métier du système.
  • Il se compose de toutes les données de l'application
  • Il représente également l'état de l'application.
  • Il se compose de classes qui ont un lien avec le base de données.
  • Le contrôleur se connecte au modèle, récupère les données et les envoie à la couche de vue.
  • Le modèle se connecte également à la base de données et stocke les données dans une base de données qui y est connectée.

Afficher le calque

  • Il s'agit d'une couche de présentation.
  • Il contient du HTML, du JSP, etc.
  • Il présente normalement l'interface utilisateur de l'application.
  • Il est utilisé pour afficher les données extraites du contrôleur qui, à son tour, récupère les données des classes de couches de modèle.
  • Cette couche de vue affiche les données sur l'interface utilisateur de l'application.

Couche de contrôleur

  • Il agit comme une interface entre la vue et le modèle.
  • Il intercepte toutes les requêtes provenant de la couche vue.
  • Il reçoit les demandes de la couche de vue, traite les demandes et effectue la validation nécessaire pour la demande.
  • Ces requêtes sont ensuite envoyées à la couche modèle pour le traitement des données, et une fois la requête traitée, elle est renvoyée au contrôleur avec les informations requises et affichées en conséquence par la vue.

Avantages de MVC Architecture

Les avantages de MVC sont :

  • Facile à entretenir
  • Facile à étendre
  • Facile à tester
  • Le contrôle de la navigation est centralisé

Exemple de conception d'application JSP avec MVC Architecture

Dans cet exemple, nous allons montrer comment utiliser l'architecture MVC dans JSP.

  • Nous prenons l'exemple d'un formulaire à deux variables « email » et « mot de passe » qui est notre couche de visualisation.
  • Une fois que l'utilisateur saisit son e-mail et son mot de passe et clique sur Soumettre, l'action est transmise dans mvc_servlet où l'e-mail et le mot de passe sont transmis.
  • Ce mvc_servlet est la couche contrôleur. Ici, dans mvc_servlet, la requête est envoyée à l'objet bean qui fait office de couche modèle.
  • Les valeurs d'e-mail et de mot de passe sont définies dans le bean et stockées à des fins ultérieures.
  • À partir du bean, la valeur est récupérée et affichée dans la couche de vue.

Mvc_example.jsp

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>MVC Guru Example</title>
</head>
<body>
<form action="Mvc_servlet" method="POST">
Email: <input type="text" name="email">
<br />
Password: <input type="text" name="password" />
<input type="submit" value="Submit" />
</form>
</body>
</html>

Explication du code :

Afficher le calque :

Ligne de code 10-15 : Ici, nous prenons un formulaire qui a deux champs comme paramètres « email » et « mot de passe » et cette requête doit être transmise à un contrôleur Mvc_servlet.java, qui est passé en action. La méthode par laquelle elle est passée est la méthode POST.

Mvc_servlet.java

package demotest;

import java.io.IOException;

import javax.servlet.RequestDispatcher;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

/**
 * Servlet implementation class Mvc_servlet
 */
public class Mvc_servlet extends HttpServlet {
	private static final long serialVersionUID = 1L;
       
    /**
     * @see HttpServlet#HttpServlet()
     */
    public Mvc_servlet() {
        super();
        // TODO Auto-generated constructor stub
    }


	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		// TODO Auto-generated method stub
		String email=request.getParameter("email");  
        String password=request.getParameter("password");
        
        TestBean testobj = new TestBean();
        testobj.setEmail(email);
        testobj.setPassword(password);
        request.setAttribute("gurubean",testobj);
        RequestDispatcher rd=request.getRequestDispatcher("mvc_success.jsp");  
        rd.forward(request, response); 
	}

}

ARTICLES LIÉS

Explication du code :

Couche contrôleur

Ligne de code 14 :mvc_servlet étend HttpServlet.

Ligne de code 26 : Comme la méthode utilisée est POST, la requête entre dans une méthode doPost du servlet qui traite les requêtes et les enregistre dans l'objet bean en tant que testobj.

Ligne de code 34 : En utilisant l'objet de requête, nous définissons l'attribut comme gurubean auquel est attribuée la valeur de testobj.

Ligne de code 35 : Ici, nous utilisons l'objet répartiteur de requêtes pour transmettre le message de réussite à mvc_success.jsp

TestBean.java

package demotest;

import java.io.Serializable;

public class TestBean implements Serializable{
	
	public String getEmail() {
		return email;
	}
	public void setEmail(String email) {
		this.email = email;
	}
	public String getPassword() {
		return password;
	}
	public void setPassword(String password) {
		this.password = password;
	}
	private String email="null";
	private String password="null";


}

Explication du code :

Couche de modèle :

Ligne de code 7-17 : Il contient les getters et setters d'e-mail et de mot de passe qui sont membres de la classe Test Bean.

Ligne de code 19-20 : Il définit l'e-mail et le mot de passe des membres de type chaîne dans la classe du bean.

Mvc_success.jsp

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
    <%@page import="demotest.TestBean"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Guru Success</title>
</head>
<body>
<%  
TestBean testguru=(TestBean)request.getAttribute("gurubean");  
out.print("Welcome, "+testguru.getEmail());  
%>
</body>
</html>

Explication du code :

Ligne de code 12 : nous obtenons l'attribut en utilisant l'objet de requête qui a été défini dans la méthode doPost du servlet.

Ligne de code 13 : Nous imprimons le message de bienvenue et l'identifiant de messagerie qui ont été enregistrés dans l'objet bean

Sortie :

Lorsque vous exécutez le code ci-dessus, vous obtenez le résultat suivant :

Lorsque vous cliquez sur mvc_example.jsp, vous obtenez le formulaire avec e-mail et mot de passe avec le bouton Soumettre.

Une fois que vous avez entré votre e-mail et votre mot de passe dans le formulaire, puis cliquez sur Soumettre

Conception d'applications JSP

Après avoir cliqué sur soumettre, le résultat est affiché comme ci-dessous

Conception d'applications JSP

Sortie :

Lorsque vous entrez l'e-mail et le mot de passe à l'écran et cliquez sur Soumettre, les détails sont enregistrés dans TestBean et à partir du TestBean, ils sont récupérés sur l'écran suivant pour obtenir le message de réussite.

Résumé

Dans cet article, nous avons découvert l'architecture MVC, c'est-à-dire Model View Controller.

JSP joue le rôle de présentation des données et de responsable de traitement. Il s'agit d'une interface entre le modèle et la vue tandis que le modèle se connecte à la fois au contrôleur et à la base de données. La logique métier principale est présente dans la couche modèle.

Tu pourrais aimer: