JSP/Servletで名簿一覧処理を作成しよう

JSP&Servlet

JSP/Servletでcsvファイルからデータを読み込み名簿一覧を表示するアプリを作ってみよう。

準備

以下から名簿csvファイルをダウンロードする。

フォルダ構成

以下が今回作成するアプリのフォルダ構成だ。迷子になったらすぐに参照してもらいたい。

作成

配置

●WEB-INFの中にdataフォルダを作成し、先程ダウンロードした
new_sample.csv
をコピペで配置する。

●中を確認してみよう。名簿のcsvファイルであることがわかる

model

●csvの情報からbeanを作成する。
modelパッケージの中にPerson.javaを以下のように作成

package model;

import java.io.Serializable;

public class Person implements Serializable{
	private String name;
	private String kana;
	private String gender;
	private String blood;
	public Person() {}
	public Person(String name, String kana, String gender, String blood) {
		this.name = name;
		this.kana = kana;
		this.gender = gender;
		this.blood = blood;
	}
	public String getName() {
		return name;
	}
	public void setName(String name) {
		this.name = name;
	}
	public String getKana() {
		return kana;
	}
	public void setKana(String kana) {
		this.kana = kana;
	}
	public String getGender() {
		return gender;
	}
	public void setGender(String gender) {
		this.gender = gender;
	}
	public String getBlood() {
		return blood;
	}
	public void setBlood(String blood) {
		this.blood = blood;
	}

}

listener

今回はリスナーを使ってアプリ起動時にPersonインスタンスの入ったリストをアプリケーションスコープに登録することにする。

●新規リスナーからInitListenerを作成する。種類は
アプリ全体の初期化処理を行うServletContextListenerを選択する。

●今回はcontextInitializedの中を以下のように記述する(エクリプスが作成した不要な部分は削除した)

package listener;

import java.io.BufferedReader;
import java.io.FileInputStream;
import java.io.IOException;
import java.io.InputStreamReader;
import java.util.ArrayList;
import java.util.List;

import javax.servlet.ServletContext;
import javax.servlet.ServletContextEvent;
import javax.servlet.ServletContextListener;
import javax.servlet.annotation.WebListener;

import model.Person;

@WebListener
public class InitListener implements ServletContextListener {
    public void contextInitialized(ServletContextEvent sce)  {
    	ServletContext application=sce.getServletContext();
    	String path=application.getRealPath("/WEB-INF/data/new_sample.csv");
    	List<Person> list=new ArrayList<>();
    	BufferedReader br=null;
    	try {
			FileInputStream fis=new FileInputStream(path);
			InputStreamReader isr=new InputStreamReader(fis,"UTF8");
			br=new BufferedReader(isr);
			String line;
			while((line=br.readLine())!=null) {
				String[] data=line.split(",");
				Person p=new Person(data[0],data[1],data[2],data[3]);
				list.add(p);
			}
		} catch ( IOException e) {
			e.printStackTrace();
		}finally {
			try {
				br.close();
			} catch (IOException e) {
				e.printStackTrace();
			}

		}
    	application.setAttribute("list", list);
    }
    public void contextDestroyed(ServletContextEvent arg0)  {
    }
}

ファイルの読み込みを利用してリストを作るお決まりとも言って良い処理だ。
こういった初期データの登録の際などがServletContextListenerの使い所の一つだ。

controller

リクエストを受信するサーブレットを作成しよう。

●新規サーブレットからcontrollerパッケージ内にMain.javaを以下のように作成する。viewにフォワードするだけのシンプルな処理だ。

package controller;

import java.io.IOException;

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

@WebServlet("/Main")
public class Main extends HttpServlet {
	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		RequestDispatcher rd=request.getRequestDispatcher("/WEB-INF/view/main.jsp");
		rd.forward(request, response);
	}
}

view

viewを作成しよう。今回はbootstapを使って見た目を整形している。

●/WEB-INF/view/main.jspを以下のように作成する。

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8" import="java.util.*,model.*"%>
<%
	List<Person> list=(List<Person>)application.getAttribute("list");
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>名簿</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
</head>
<body>
<div class="container">
<table class="table table-striped table-bordered table-dark">
<% for(Person p:list){ %>
<tr>
<td><%=p.getName() %></td>
<td><%=p.getKana() %></td>
<td><%=p.getGender() %></td>
<td><%=p.getBlood() %></td>
</tr>
<%} %>
</table>
</div>
</body>
</html>

アプリケーションスコープからリストを取り出し表を作成している。説明の必要もないくらい定型的な処理だ。

完成

実行してみよう。以下のように表示されれば成功だ。

コメント

タイトルとURLをコピーしました