[JAVA] [Introduction à JSP + Servlet] J'ai joué avec pendant un moment ♬

Je suis un débutant complet, donc je peux écrire quelque chose de bâclé, mais pardonnez-moi s'il vous plaît. Cette fois, j'ai décidé d'essayer JSP + Servlet pendant un certain temps, je vais donc résumer ce que j'ai appris de manière simple. Je vais le créer presque comme une référence et écrire l'histoire à partir de là. 【référence】 ① Introduction à JSP & Servlet

Ce que j'ai fait

・ Installation de l'éclipse ・ Faites-en un simple ・ Prend en charge l'entrée japonaise ・ Affichage de l'image ・ Ajouter un code

・ Installation de l'éclipse

Il existe également une version récente, mais la référence [https://ftp.jaist.ac.jp/pub/mergedoc/pleiades/4.6/pleiades-4.6.3-java-win-64bit-jre_20170422.zip](https: / /mergedoc.osdn.jp/index.html#/pleiades_distros4.6.html) a été installé sur Windows 10 comme expliqué. (Les chiffres ci-dessous sont tirés de la référence ci-dessus) ① Créez un dossier tel que C: \ app ② Déplacez le fichier zip téléchargé ③ Changez le nom du fichier en pleiades-4.6.3.zip ④ Extrayez le fichier ZIP ⑤ Déplacez les pléiades dans le dossier développé vers C: \ app -Double-cliquez sur eclipse.exe dans le répertoire sous \ app \ pleiades \ eclipse pour le démarrer. L'espace de travail est OK par défaut au démarrage -Pin à la barre des tâches. Faites un clic droit et cliquez sur "Épingler à la barre des tâches" 【référence】 ・ Utilisation ultra-basique d'Eclipse

・ Faites-en un simple

Faisons la plus simple de la référence ci-dessus ①. Vous pouvez maintenant voir la structure du répertoire et comment le déplacer. ① Lorsque vous démarrez eclipse, le package X-prowler est en haut à gauche. Clic droit dans cette zone (à l'intérieur du carré) ... transitions dans l'ordre entre (), -Créer un projet Web dynamique (clic droit-nouveau-autre-projet Web dynamique-suivant) ・ Nom du projet; sampleWeb -Target runtime; Tomcat8 (Java8) Vous pouvez créer un exemple de projet Web en tapant. ② Faites un clic droit sur src cette fois (Nouveau-Autre-Servlet-Suivant) -Java package; sample.controller ・クラス名；HelloSample.java Vous pouvez créer un servlet; sample.controller en tapant. Cela semble être le servlet le plus simple.

Je vais le démarrer

Cliquez avec le bouton droit sur sampleWeb-Run-1 Cliquez sur Exécuter sur le serveur. .. .. URL;http://localhost:8080/sampleWeb/HelloSample Vous pouvez voir que ce qui suit est exécuté dans. Cela fonctionnait même si je remplaçais l'URL ci-dessus et la renvoyais avec un navigateur normal.

Served at: /sampleWeb

Le code est ci-dessous C'est un squelette, mais ça marche.

• Parce que je suis débutant, je ne peux pas l'expliquer, mais je vais regarder le code pour le moment Dans un premier temps, déclarez le nom du package et utilisez Lib; comme ceci. Je sens que je peux dire à partir du nom.

HelloSample.py

package sample.controller;

import java.io.IOException;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

Ensuite, il y a une annotation indiquant qu'il s'agit de @WebServlet ("/ HelloSample"). En même temps que le commentaire, il semble informer le système du mappage de WebServlet ("/ HelloSample"). Il est cité de la référence ②. "Les annotations ne font pas partie d'un programme, mais elles fournissent des informations sur le programme. Dans la programmation de servlet, les annotations peuvent être utilisées pour déclarer des informations de mappage entre les chemins d'URL et les servlets. La dernière version de Java EE vous permet d'utiliser des annotations sans utiliser web.xml pour le mappage. Vous pouvez choisir d'utiliser web.xml ou des annotations. "

• Pour plus de détails, reportez-vous à la référence ci-dessous.

【référence】 ② [Java & Tomcat] Paramètres de l'application Web (annotation) * avec exemple de programme

/**
 * Servlet implementation class HelloSample
 */
@WebServlet("/HelloSample")
public class HelloSample extends HttpServlet {
	private static final long serialVersionUID = 1L;

Et dans le constructeur, cela sera exécuté en premier lors de son démarrage. Cela ne semble rien faire.

    /**
     * @see HttpServlet#HttpServlet()
     */
    public HelloSample() {
        super();
        // TODO Auto-generated constructor stub
    }

Vient ensuite doGet. Ceci est (demande, réponse) et il interagit avec quelque chose.

	/**
	 * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
	 */
	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		// TODO Auto-generated method stub
		response.getWriter().append("Served at: ").append(request.getContextPath());
	}

Ensuite, il y a eu doPost. C'est aussi (demande, réponse) d'interagir avec quelque chose. N'est-ce pas pareil? ?? La seule fonction écrite est doGet (), qui est appelée (exécutée).

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

En d'autres termes, ce servlet est démarré, doGet est en cours d'exécution,

response.getWriter().append("Served at: ").append(request.getContextPath());

A bougé.

・ Essayez de créer Jsp-Servlet

Après tout, si vous ne faites pas de Jsp, cela va à l'encontre du titre, alors je vais le faire. C'est également tout comme indiqué dans la référence ① ci-dessus. -Créer index.jsp (cliquez avec le bouton droit sur le fichier WebContent-New-Other-jsp Nom de fichier; index.jsp Entrez et complétez Vous venez de créer index.jsp directement sous WebContent. Le code est ci-dessous Nous avons ajouté <% = new java.util.Date ()%> pour afficher l'heure dans le corps. De plus, le titre est Hello, World.

.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>

Maintenant, déplaçons-le de la même manière qu'avant. Ce qui suit est http://localhost:8080/sampleWeb/ C'était sortie vers.

Wed Apr 22 21:55:03 JST 2020 

La structure des répertoires est la suivante. Je ne comprends pas vraiment comment ça marche, ．．． Apparemment, chacun travaille seul, http: // localhost: 8080 / sampleWeb / Il semble que index.jsp soit appelé et que l'heure soit affichée. D'autre part, à http: // localhost: 8080 / sampleWeb / HelloSample, Served at: / sampleWeb s'affiche. Cela ne semble pas être le titre à moins que nous n'interagissions les uns avec les autres.

・ Prend en charge l'entrée japonaise

Tout d'abord, pour échanger entre jsp-servelets, déplacez index.jsp sous WEB-INF afin qu'il ne soit pas visible de l'extérieur. -Créez un dossier de vue sous WEB-INF (cliquez avec le bouton droit sur WEB-INF-New-Folder Next et entrez view-Done), faites glisser index.jsp là-bas et déposez-le pour le déplacer.

-Passez les informations de HelloSample vers JSP

"Lorsqu'un client (navigateur) fait une requête à HelloSample, la méthode doGet est exécutée." Alors, écrivez ce qui suit dans doGet de HelloSample.java.

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

Maintenant que HelloSample.java a été réécrit, redémarrez le serveur. La référence ① ci-dessus provient de la fenêtre. .. Cependant, ici, vous pouvez ré-exécuter en cliquant avec le bouton droit sur l'exécution de sampleWeb-execution-1 sur le serveur-complete. Maintenant, le message suivant s'affiche, mais le redémarrage est réussi. En fait, http: // localhost: 8080 / sampleWeb / HelloSample Si vous mettez url et retournez, la dernière fois sera affichée, et vous pouvez voir que index.jsp a été appelé et affiché.

État HTTP 404- /sampleWeb/
rapport d'état de type
message/sampleWeb/
Description La ressource demandée n'est pas disponible.
Apache Tomcat/8.0.43

Ensuite, passez une chaîne de caractères appropriée de HelloSample.java à index.jsp et affichez-la.

Ajoutez le code suivant au doGet ci-dessus.

	    //Passez une chaîne appropriée à JSP
	    request.setAttribute("foo", "bar");

Et index.jsp est reçu comme suit.

.jsp

	<%= request.getAttribute("foo") %>

En conséquence, redémarrez le serveur comme ci-dessus, http://localhost:8080/sampleWeb/HelloSample Si vous regardez, vous pouvez voir que ce qui suit est affiché. Thu Apr 23 17:35:06 JST 2020 bar En d'autres termes, puisqu'elle a été placée derrière, la barre est affichée après l'heure.

Rendre la livraison un peu plus compliquée

Tout d'abord, l'index.jsp de réception est décrit comme suit. Lorsque «» est décrit, c'est comme suit. Je laisse les ajouts jusqu'à présent.

.jsp

<body>
	<%= new java.util.Date() %>
	<%= request.getAttribute("foo") %>
	<form method="post" action="./HelloSample">
Entrez quelque chose: <input type="text" name="hoge">
        <button type="submit">Envoyer</button>
    </form>
</body>

Ensuite, le destinataire le reçoit avec doPost de HelloSample.java cette fois. request.getPasrameter("hoge"); Obtenez la valeur avec, affectez-la à valeur et envoyez-la à la sortie standard.

	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);
	}

Ensuite, l'application liée appelée JSP-Servlet-JSP est la suivante

Si vous écrivez autant que possible sans effacer le code jusqu'à présent,

.jsp

<body>
	<%= new java.util.Date() %>
	<%= request.getAttribute("foo") %><br/>
	<%= request.getAttribute("userName") %>
	<form method="post" action="./HelloSample">
Entrez quelque chose: <input type="text" name="name">
        <button type="submit">Envoyer</button>
    </form>
</body>

Du côté Servlet, doPost de HelloSample.java est réécrit comme suit

	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
	    //Spécification du code de caractère
	    request.setCharacterEncoding("utf-8");
	    String name = request.getParameter("name");
	    request.setAttribute("userName", name);

	    System.out.println(name);
        doGet(request, response);
	}

De plus, doGet est:

	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
	    //Passez une chaîne appropriée à JSP
		request.setAttribute("foo", "bar");
	    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);
	}

Tout d'abord, exécutez Servlet; HelloSample.java sur un serveur. Et si vous regardez l'url suivante avec un navigateur http://localhost:8080/sampleWeb/

État HTTP 404- /sampleWeb/
rapport d'état de type
message/sampleWeb/
Description La ressource demandée n'est pas disponible.
Apache Tomcat/8.0.43

Et http://localhost:8080/sampleWeb/HelloSample L'image suivante apparaît.

Thu Apr 23 21:35:55 JST 2020 bar
Guest
Entrez quelque chose:Envoyer

Si vous entrez ce qui suit et appuyez sur envoyer,

Thu Apr 23 21:35:55 JST 2020 bar
Guest
Entrez quelque chose:Transmission MuAuan

L'invité a changé pour MuAuan comme ci-dessous,

Thu Apr 23 21:35:55 JST 2020 bar
MuAuan
Entrez quelque chose:Envoyer

MuAuan est émis vers la sortie standard. Vous pouvez donc voir que JSP-Servlet-JSP et MuAuan ont été adoptés.

D'autre part, dans le cas du code ci-dessus, le japonais est également affiché correctement.

Muuwan a également été affiché en toute sécurité. Cela est dû au fait que le code de caractère est spécifié par le code suivant. Si vous essayez de supprimer cela, des caractères déformés apparaîtront.

        //Spécification du code de caractère
	    request.setCharacterEncoding("utf-8");
	    String name = request.getParameter("name");
	    request.setAttribute("userName", name);

Vous pouvez également éliminer les caractères déformés avec le code suivant. Cependant, selon référence, ce qui suit semble être un ancien code obsolète, car il peut maintenant être fait avec le code ci-dessus. 【référence】

• Le passage des paramètres JSP / Servlet est brouillé et ne fonctionne pas.

	    String name = new String(request.getParameter("name").getBytes("ISO-8859-1"), "UTF-8");
	    request.setAttribute("userName", name);

・ Affichage de l'image

La prochaine fois, j'aimerais afficher l'image car elle est terne. Cependant, il n'y a pas d'exemple. Alors j'ai réussi à le faire ... J'aimerais lire toute la référence. 【référence】 ・ Insérer une image dans la page jsp

Ajouter des fichiers image à votre projet

-Cliquez avec le bouton droit sur le nom du dossier WebContent-New-Folder; Ajouter un dossier de stockage d'images appelé média une fois terminé avec le média ・ Ajoutez les fichiers d'image que vous souhaitez afficher dans ce dossier. Cliquez avec le bouton droit sur le média-Nouveau-Fichier-Extension-Vérifier le lien vers le fichier dans le système de fichiers-Référence-Cliquez sur le fichier image-Ouvrir-Terminé Ensuite, un fichier image sera ajouté au dossier.

Affichage sur JSP

finalement <img src="${pageContext.request.contextPath}/media/image.png " alt="Tokyo"> Ensuite, le fichier image a été affiché.

<body>
	<%= new java.util.Date() %>
	<%= request.getAttribute("foo") %><br/>
	<%= request.getAttribute("userName") %>
	<form method="post" action="./HelloSample">
Entrez quelque chose: <input type="text" name="name">
        <button type="submit">Envoyer</button>
    </form>
	<br/>
    <img src="${pageContext.request.contextPath}/media/image.png " alt="Tokyo">
</body>

J'aimerais passer des images après ça, mais. .. .. Je manquais encore de puissance.

Résumé

・ J'ai joué avec JSP + Servlet ・ J'ai pu afficher du japonais et des images

・ Image librement. .. .. Je veux essayer le dessin animé d'objets

Je mets le code ci-dessous

• JSP-Servlet / HelloSample.java
• JSP-Servlet / index.jsp