[JAVA] Premiers pas avec JSP et servlet

introduction

Pour plus d'informations sur la configuration de l'environnement de développement, reportez-vous à Eclipse Super Basic Usage --Qiita.

Tout d'abord, vérifions le fonctionnement de Servlet et JSP. (Cet article) Après cela, j'expliquerai les bases du développement d'applications Web par JSP & Servlet à travers le développement de l'application TODO. (La prochaine fois)

Créer un projet

1 2 3
Créer un projet(1) Créerunprojet(2) Créerunprojet(3)

Créer HelloServlet

Tout d'abord, créez un servlet très simple pour vérifier le fonctionnement.

Créer une classe de servlet

Exécution du servlet

1 2 3
Capture d'écran 2017-06-22 14.51.48.png Captured'écran2017-06-2214.52.29.png Captured'écran2017-06-2214.53.09.png

Création de index.jsp

Ensuite, vérifiez le fonctionnement de JSP.

Créer un fichier JSP

index.jsp


<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!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=UTF-8">
<title>Hello, World!</title>
</head>
<body>
	<%= new java.util.Date() %>
</body>
</html>

Accédez à http: // localhost: 8080 / TodoServlet / avec le navigateur intégré d'Eclipse ou le navigateur que vous utilisez normalement.

スクリーンショット 2017-06-22 15.13.18.png

Code source jusqu'à présent: Kazunori-Kimura / todo-servlet at v1.0.0

Nous avons confirmé la méthode de création et le fonctionnement de Servlet et JSP. Eclipse crée des modèles pour les classes et les fichiers, il semble donc que vous puissiez créer une application Web simplement en la complétant.

Coopération entre Servlet et JSP

JSP est converti en Servlet par Tomcat et exécuté. Par conséquent, ce que vous pouvez faire avec Servlet devrait essentiellement être possible avec JSP.

Cependant, si vous insérez la logique détaillée dans la JSP qui intègre le code en HTML, le code source deviendra bientôt flou.

En divisant les rôles, les perspectives s'amélioreront et le développement se déroulera sans heurts.

Je vais vous expliquer comment lier Servlet et JSP à l'aide d'un exemple simple.

Transférer du servlet vers JSP

Tout d'abord, implémentez-le pour que le servlet reçoive simplement la demande et renvoie le contenu de la JSP.

Déplacer index.jsp

Déplacez ʻindex.jsp sous WEB-INFpour que le JSP ne soit pas accessible directement. À l'avenir, nous créerons un dossierWEB-INF / view` et placerons les fichiers JSP sous celui-ci afin qu'il soit plus facile à gérer lorsqu'il y a plusieurs fichiers JSP.

Correctif HelloServlet

Lorsqu'un client (navigateur) fait une requête à «HelloServlet», la méthode «doGet» est exécutée.

Vous pouvez utiliser la méthode RequestDispatcher # forward pour transférer le traitement vers un autre servlet ou JSP.

Cette fois, lorsqu'une requête arrive à / HelloServlet, elle est transmise à WEB-INF / view / index.jsp.

HelloServlet.java



/**
 * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
 */
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
	// TODO Auto-generated method stub

	String view = "/WEB-INF/view/index.jsp";
	RequestDispatcher dispatcher = request.getRequestDispatcher(view);

	dispatcher.forward(request, response);
}

Afficher la vue du serveur et redémarrer Tomcat

Tomcat sera redémarré pour que les modifications du servlet prennent effet.

Accédez à http: // localhost: 8080 / TodoServlet / HelloServlet dans votre navigateur et vérifiez que vous pouvez voir le contenu de ʻindex.jsp`.

Code source jusqu'à présent: Kazunori-Kimura / todo-servlet at v2.0.0

Passer des valeurs de Servlet à JSP

Utilisez la méthode HttpServletRequest # setAttribute pour transmettre les valeurs du servlet à la JSP.

Définissez la clé dans le premier argument et la valeur dans le deuxième argument.

HelloServlet.java


/**
 * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
 */
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
	//Passez une chaîne appropriée à JSP
	request.setAttribute("foo", "bar");

	//Transférer vers JSP
	String view = "/WEB-INF/view/index.jsp";
	RequestDispatcher dispatcher = request.getRequestDispatcher(view);

	dispatcher.forward(request, response);
}

La valeur setAttribute dans le servlet peut être obtenue avec la méthode request.getAttribute dans la JSP.

L'objet request est disponible dans la JSP sans aucune déclaration spéciale.

index.jsp


<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!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=UTF-8">
<title>Hello, World!</title>
</head>
<body>
	<%= request.getAttribute("foo") %>
</body>
</html>

Code source jusqu'à présent: Kazunori-Kimura / todo-servlet at v2.1.0

Référence: type EL

Abréviation de * Expression Language *. L'expression est évaluée et sortie en écrivant «$ {...}».

Cliquez ici pour une explication détaillée> [Pour les débutants] Formule EL - Qiita

Dans l'expression EL, vous pouvez obtenir la valeur en omettant la description de request.getAttribute.

index.jsp


<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!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=UTF-8">
<title>Hello, World!</title>
</head>
<body>
	${foo}
</body>
</html>

Passer les valeurs de JSP au servlet

Placez une zone de texte sur le JSP et laissez le servlet recevoir la valeur saisie.

Utilisez les balises form et ʻinput` pour accepter certaines entrées de l'utilisateur dans JSP.

index.jsp


<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!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=UTF-8">
<title>Hello, World!</title>
</head>
<body>
	<%= request.getAttribute("foo") %>

	<form method="post" action="./HelloServlet">
Entrez quelque chose: <input type="text" name="hoge">
		<button type="submit">Envoyer</button>
	</form>
</body>
</html>

Spécifie la méthode HTTP à utiliser lorsque le bouton submit est enfoncé dans l'attribut method de la balise form. Vous utiliserez get ou post.

L'attribut ʻaction` spécifie l'URL de destination. Il est préférable de spécifier le chemin par rapport à l'URL actuellement affichée sur le navigateur. Si vous spécifiez un chemin absolu, il sera difficile de gérer les cas où l'URL diffère entre l'environnement de production et l'environnement de développement.

Puisque la méthode get est utilisée lorsqu'il y a une requête du navigateur, utilisez la méthode post pour recevoir des données du formulaire.

Affichez une zone de texte en utilisant la balise ʻinput`.

Si l'attribut type de la balise button est submit, la balise form est utilisée dans la méthode HTTP spécifiée par l'attribut method pour l'URL spécifiée dans l'attribut action du form lorsque le bouton est cliqué. Envoie la valeur de chaque élément dans.

HelloServlet.java


/**
 * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
 */
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
	//Obtenez de la valeur grâce à la forme
	String value = request.getParameter("hoge");
	System.out.println(value);

	doGet(request, response);
}

Lorsque l'utilisateur clique sur le bouton, le processus passe à la méthode doPost.

La valeur saisie dans form peut être obtenue avec la méthode HttpServletRequest # getParameter. Pour l'argument, spécifiez l'attribut name de la balise ʻinput`.

Cette fois, j'obtiens la valeur de name =" hoge ", je la sortie sur la console, puis j'exécute la méthode doGet.

Code source jusqu'à présent: Kazunori-Kimura / todo-servlet at v2.2.0

JSP -> Servlet -> JSP

Implémentons un comportement de type application Web en combinant la coopération de JSP à Servlet et la coopération de Servlet à JSP.

  1. S'il y a un accès GET "Hello, Guest-san!" Pour afficher le message, le formulaire de saisie du nom
  2. Entrez le nom et cliquez sur le bouton Soumettre pour POSTER l'entrée dans le servlet.
  3. Remplacez "Invité" par le nom POSTÉ pour masquer le formulaire

Préparation du formulaire de saisie du nom

Préparez d'abord le message et le formulaire de saisie du nom "Hello".

index.jsp


<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!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=UTF-8">
<title>Hello, World!</title>
</head>
<body>
Bonjour,<%= request.getAttribute("userName") %>San!

	<form method="post" action="./Hello">
S'il vous plaît entrez votre nom: <input type="text" name="name">
		<button type="submit">Envoyer</button>
	</form>
</body>
</html>

Initialisation variable au premier accès

Puisque nous voulons afficher "Invité" lors de l'accès avec GET pour la première fois, définissez "Invité" sur ʻuserName`.

HelloServlet.java


/**
 * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
 */
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
	request.setAttribute("userName", "Guest");

	String view = "/WEB-INF/view/index.jsp";
	RequestDispatcher dispatcher = request.getRequestDispatcher(view);
	dispatcher.forward(request, response);
}

Réception des données d'entrée

Reçoit le nom saisi dans le formulaire et met à jour ʻuserName`.

Lorsqu'il s'agit de langues telles que le japonais, le chinois et le coréen (appelé CJK de l'acronyme chinois, japonais, coréen ou CJKV en ajoutant le vietnamien), les caractères seront déformés si le code de caractère n'est pas spécifié correctement. Veuillez noter que cela se produira.

HelloServlet.java


/**
 * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
 */
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
	//Spécification du code de caractère
	request.setCharacterEncoding("utf-8");
	//Obtenez de la valeur grâce à la forme
	String name = request.getParameter("name");

	request.setAttribute("userName", name);

	doGet(request, response);
}

Affichage des données d'entrée

ʻDéfinir "Invité" uniquement si userName est null` ou vide.

HelloServlet.java


/**
 * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
 */
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
	String name = (String) request.getAttribute("userName");
	
	if (name == null || "".equals(name)) {
		request.setAttribute("userName", "Guest");
	}
	
	String view = "/WEB-INF/view/index.jsp";
	RequestDispatcher dispatcher = request.getRequestDispatcher(view);
	dispatcher.forward(request, response);
}

Masquer le formulaire de saisie

Une fois que vous avez entré votre nom, vous n'avez pas besoin d'un formulaire de saisie et le masquez. ʻLe formulaire de saisie est affiché uniquement lorsque userName` est "Invité".

index.jsp


<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!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=UTF-8">
<title>Hello, World!</title>
</head>
<body>
	<% String userName = (String) request.getAttribute("userName"); %>
Bonjour,<%= userName %>San!

	<% if ("Guest".equals(userName)) { %>
	<form method="post" action="./HelloServlet">
S'il vous plaît entrez votre nom: <input type="text" name="name">
		<button type="submit">Envoyer</button>
	</form>
	<% } %>
</body>
</html>

Contrôle de fonctionnement

1 2
Capture d'écran 2017-06-27 10.19.16.png Captured'écran2017-06-2710.19.31.png

Code source jusqu'à présent: Kazunori-Kimura / todo-servlet at v2.3.0

Vulnérabilités des scripts intersites (XSS)

En fait, l'application Web que nous venons de créer est vulnérable aux scripts intersites (XSS). XSS * intègre un script malveillant dans le site Web de quelqu'un d'autre *.

En fait, entrez <script> alert (" stupid "); </ script> sous la forme du nom.

Pour Google Chrome, l'écran d'erreur «ERR_BLOCKED_BY_XSS_AUDITOR» s'affiche comme illustré ci-dessous.

スクリーンショット 2017-06-27 10.29.59.png

En fonction de votre navigateur, le script ne sera pas bloqué et vous verrez une boîte de dialogue appelée «stupide».

Comment éviter XSS

La cause de XSS est que les données saisies par l'utilisateur sont sorties au format HTML telles quelles. Une mesure efficace contre XSS est d'empêcher les caractères tels que «<» et «>» d'être reconnus comme des balises. Ce processus s'appelle * escape *.

Les fonctions de traitement d'échappement sont fournies en standard en PHP et JavaScript, mais pas Java (JSP). Vous pouvez créer le vôtre, mais il est possible que des bogues soient mélangés, il est donc préférable d'introduire une bibliothèque éprouvée.

En outre, certaines personnes peuvent envisager une méthode de vérification de l'entrée et de ne pas saisir de caractères tels que «<» et «>», mais ce n'est pas une bonne méthode pour les contre-mesures XSS. La vérification des entrées est facile avec un formulaire simple comme celui-ci, mais il est difficile d'implémenter et de tester pour effectuer une vérification d'entrée sans omission dans une application Web compliquée. Il serait également difficile de s'assurer qu'il n'y a absolument aucun moyen de contourner la vérification d'entrée. Après tout, en tant que contre-mesure XSS, il est facile et fiable de s'échapper au moment de la sortie.

Introduction de taglib

JSP a un mécanisme appelé «bibliothèque de balises». En encapsulant le traitement de JSP, vous pouvez améliorer la visibilité de JSP et améliorer la réutilisabilité des fonctions.

procédure image
Apache Tomcat® - Apache Taglibs DownloadsTéléchargezlesquatrefichiersjaràpartirde. Captured'écran2017-06-2710.49.17.png
Éclipse/WebContent/WEB-INF/libFaites glisser les 4 bocaux que vous avez téléchargés&Laissez tomber Un message de confirmation s'affiche.Copier un fichierSélectionnerOKCliquez sur. Capture d'écran 2017-06-27 10.52.45.png
libAssurez-vous que le fichier existe dans le dossier. Capture d'écran 2017-06-27 10.53.02.png

Modifier index.jsp

JSTL est lu avec la directive <% @ taglib%>. La partie de sortie est passée de «<% =%>» à la balise «<c: out>». La balise <c: out> s'échappe par défaut.

Référence: Référence JSTL: <c: out>

index.jsp


<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!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=UTF-8">
<title>Hello, World!</title>
</head>
<body>
	<% String userName = (String) request.getAttribute("userName"); %>
Bonjour,<c:out value="${userName}" />San!

	<% if ("Guest".equals(userName)) { %>
	<form method="post" action="./HelloServlet">
S'il vous plaît entrez votre nom: <input type="text" name="name">
		<button type="submit">Envoyer</button>
	</form>
	<% } %>
</body>
</html>

Contrôle de fonctionnement

1 2
Capture d'écran 2017-06-27 11.02.14.png Captured'écran2017-06-2711.02.23.png

Code source jusqu'à présent: Kazunori-Kimura / todo-servlet at v2.4.0

référence

Nous avons vérifié le fonctionnement de Servlet et JSP, et expliqué comment lier Servlet <-> JSP avec une application Web très simple. De plus, les contre-mesures XSS introduites à la fin sont très importantes, soyez donc toujours prudent lors de la création d'une application Web.

Recommended Posts

Premiers pas avec JSP et servlet
Premiers pas avec Ruby
Premiers pas avec Swift
Premiers pas avec Doma-Transactions
Premiers pas avec le traitement Doma-Annotation
Premiers pas avec Java Collection
Premiers pas avec les bases de Java
Premiers pas avec Spring Boot
Premiers pas avec les modules Ruby
Premiers pas avec Java_Chapitre 5_Exercices pratiques 5_4
Passer des paramètres de JSP avec un servlet
[Google Cloud] Premiers pas avec Docker
Hello World avec GlassFish 5.1 + Servlet + JSP
Premiers pas avec Docker avec VS Code
Premiers pas avec Doma-Criteria API Cheet Sheet
Premiers pas avec Ruby pour les ingénieurs Java
Premiers pas avec Docker pour Mac (installation)
Introduction au test de paramétrage dans JUnit
Introduction à Java à partir de 0 Partie 1
Démarrez avec le fonctionnement de JVM GC
Premiers pas avec Language Server Protocol avec LSP4J
Premiers pas avec la création d'ensembles de ressources avec ListResoueceBundle
Premiers pas avec Java_Chapter 8_A propos des "Instances" et des "Classes"
Premiers pas avec Doma-Using Projection avec l'API Criteira
Premiers pas avec les sous-requêtes utilisant Doma avec l'API Criteria
Premiers pas avec Java 1 Assembler des éléments similaires
Premiers pas avec Kotlin à envoyer aux développeurs Java
Premiers pas avec Doma-Using Joins avec l'API Criteira
Premiers pas avec Doma - Introduction à l'API Criteria
J'ai essayé de démarrer avec Gradle sur Heroku
À propos de [servlet] [JSP] [tomcat]
Commencez avec Gradle
Prise en main des programmes Java à l'aide de Visual Studio Code
Premiers pas avec les anciens ingénieurs Java (Stream + Lambda)
Mémo de développement d'applications Web avec MVN, Tomcat, JSP / Servlet avec VScode
Premiers pas avec Reactive Streams et l'API JDK 9 Flow
Démarrez avec Spring Boot
Dessin d'une vue Servlet / JSP Java
Affichage d'erreur JSP à partir du servlet
Jusqu'à ce que vous créiez une application Web avec Servlet / JSP (Partie 1)
Prise en main de Completable Future (First Future)
Premiers pas avec Git Hub Container Registry au lieu de Docker Hub
Comparaison du développement d'applications WEB avec Rails et Java Servlet + JSP
Créez une application mémo avec Tomcat + JSP + Servlet + MySQL à l'aide d'Eclipse
Résumer les principaux points de démarrage avec JPA appris avec Hibernate
Présentation de Swift / C Bridge avec l'histoire du portage d'Echo Server à l'aide de libuv
[Introduction à JSP + Servlet] J'ai joué avec pendant un moment ♬
Commençons par la programmation parallèle
Comment utiliser scope (JSP & Servlet)
Portée de la requête Java Servlet / JSP, partie 1
Comment démarrer avec Slim
Portée de la requête Java Servlet / JSP, partie 2
À propos du téléchargement d'images de jsp (servlet)
CompletableFuture Getting Started 2 (Essayez de faire CompletableFuture)
La coopération des messages a commencé avec Spring Boot
Premiers pas avec Micronaut 2.x ~ Construction native et déploiement sur AWS Lambda ~
Premiers pas avec le Machine Learning avec Spark "Price Estimate" # 1 Chargement des ensembles de données avec Apache Spark (Java)