Java Eclipseで動的 Webプロジェクト

前に、EclipseEclipse Tomcat Pluginをインストールしたり、Tomcatのバージョン9をインストールしたりしてましたが、そんなことしなくてもEclipseを最初にインストールするときにTomcatも入れてる場合は、普通にWebプロジェクト動くようです。(Eclipse Tomcat Pluginの存在って....

 

動的 Webプロジェクト

Eclipseを起動し、「パッケージ・エクスプローラー」上で右クリックし、「新規(W)」>「その他」を選択。

f:id:ts0818:20170727180321j:plain

「Web」>「動的 Web プロジェクト」を選択。

f:id:ts0818:20170727180322j:plain

「プロジェクト名(M):」を適当に入力し、「ターゲット・ランタイム(U)」を選択(EclipseをインストールしたフォルダにあるTomcatを使う場合は、Tomcat 7(Java7)を選択になるかと。)し、「完了(F)」をクリック。

f:id:ts0818:20170727180323j:plain

自分の場合は、C:¥Eclipse4.6¥pleiades¥tomcatフォルダにTomcatが入っています。自分は別途インストールしてきた「apache-tomcat-9.0.0.M21」を「ターゲット・ランタイム(U)」に指定してます。

f:id:ts0818:20170727180324j:plain

 

jspファイルを作ってみる

「動的 Web プロジェクト」が作成されると、フォルダが自動で作成されますが、 

  • src
  • WebContent
    • jspファイル、htmlファイル、cssファイル、jsファイル、imgファイルなど

を配置していくようなイメージです。

f:id:ts0818:20170727180325j:plain

画面の表示は、jspファイルに、ロジック的なことはServletJavaファイル) に任せる感じになるようです。

さっそくjspファイルを作ってみます。

「パッケージ・エクスプローラー」のプロジェクト内の「WebContent」フォルダを選択した状態で、「新規(W)」>「その他(O)...」を選択。

f:id:ts0818:20170727180326j:plain

「Web」>「JSPファイル」を選択。

f:id:ts0818:20170727180327j:plain

「ファイル名(M)」を入力し、「次へ(N)」をクリック。

f:id:ts0818:20170727180328j:plain

「新規 JSPファイル(html)」を選択し、「完了(F)」をクリック。

f:id:ts0818:20170727180329j:plain

ファイルが作成されます。

<%@ 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>Insert title here</title>
</head>
<body>

</body>
</html>

デフォルトはHTML 4.01の記述になってしまっているので、HTML5で行きたい場合は、

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

の2個所を

<!DOCTYPE html>
<metacharset="UTF-8">

にしておきます。

内容を書き換えます。

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%
String message = "Hello JSP!";
%>
<!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>Insert title here</title>
</head>
<body>
  <p><%=message %></p>
</body>
</html>    

実行してみます。

「パッケージ・エクスプローラー」でプロジェクトを選択した状態で、f:id:ts0818:20170714224011j:plain の▼をクリックし、「実行(R)」>「サーバーで実行」をクリック。

f:id:ts0818:20170727180330j:plain

「次へ(N)>」をクリック。

f:id:ts0818:20170727180331j:plain

「構成済み(C):」にプロジェクトが追加されていればOK。「完了(F)」をクリック。

f:id:ts0818:20170727180332j:plain

サーバーが実行されると、「コンソール」にいろいろ表示されます。

情報: Server version:        Apache Tomcat/9.0.0.M21 [木 7 27 19:23:23 JST 2017]
情報: Server built:          May 4 2017 22:42:36 UTC [木 7 27 19:23:23 JST 2017]
情報: Server number:         9.0.0.0 [木 7 27 19:23:23 JST 2017]
情報: OS Name:               Windows 10 [木 7 27 19:23:23 JST 2017]
情報: OS Version:            10.0 [木 7 27 19:23:23 JST 2017]
情報: Architecture:          amd64 [木 7 27 19:23:23 JST 2017]
情報: Java Home:             C:\Eclipse4.6\pleiades\java\8\jre [木 7 27 19:23:23 JST 2017]
情報: JVM Version:           1.8.0_131-b11 [木 7 27 19:23:23 JST 2017]
情報: JVM Vendor:            Oracle Corporation [木 7 27 19:23:23 JST 2017]
情報: CATALINA_BASE:         C:\workspace\.metadata\.plugins\org.eclipse.wst.server.core\tmp0 [木 7 27 19:23:23 JST 2017]
情報: CATALINA_HOME:         C:\Eclipse4.6\pleiades\tomcat\apache-tomcat-9.0.0.M21 [木 7 27 19:23:23 JST 2017]
情報: Command line argument: -Dcatalina.base=C:\workspace\.metadata\.plugins\org.eclipse.wst.server.core\tmp0 [木 7 27 19:23:23 JST 2017]
情報: Command line argument: -Dcatalina.home=C:\Eclipse4.6\pleiades\tomcat\apache-tomcat-9.0.0.M21 [木 7 27 19:23:23 JST 2017]
情報: Command line argument: -Dwtp.deploy=C:\workspace\.metadata\.plugins\org.eclipse.wst.server.core\tmp0\wtpwebapps [木 7 27 19:23:23 JST 2017]
情報: Command line argument: -Djava.endorsed.dirs=C:\Eclipse4.6\pleiades\tomcat\apache-tomcat-9.0.0.M21\endorsed [木 7 27 19:23:23 JST 2017]
情報: Command line argument: -Dfile.encoding=UTF-8 [木 7 27 19:23:23 JST 2017]
情報: The APR based Apache Tomcat Native library which allows optimal performance in production environments was not found on the java.library.path: [C:\Eclipse4.6\pleiades\java\8\bin;C:\WINDOWS\Sun\Java\bin;C:\WINDOWS\system32;C:\WINDOWS;C:/Eclipse4.6/pleiades/eclipse/jre/bin/../jre/bin/server;C:/Eclipse4.6/pleiades/eclipse/jre/bin/../jre/bin;C:/Eclipse4.6/pleiades/eclipse/jre/bin/../jre/lib/amd64;C:\Program Files\Common Files\Microsoft Shared\Windows Live;C:\Program Files (x86)\Common Files\Microsoft Shared\Windows Live;C:\Program Files (x86)\NVIDIA Corporation\PhysX\Common;C:\Windows\system32;C:\Windows;C:\Windows\System32\Wbem;C:\Windows\System32\WindowsPowerShell\v1.0\;C:\Program Files (x86)\Windows Live\Shared;C:\Program Files\Intel\WiFi\bin\;C:\Program Files\Common Files\Intel\WirelessCommon\C:\MinGW\bin;c:\xampp\perl\bin\;c:\xampp\php\;c:\xampp\mysql\bin\;C:\ProgramData\ComposerSetup\bin;C:\ProgramData\chocolatey\bin;C:\Program Files\TortoiseGit\bin;C:\WINDOWS\system32;C:\WINDOWS;C:\WINDOWS\System32\Wbem;C:\WINDOWS\System32\WindowsPowerShell\v1.0\;C:\Program Files\nodejs\;C:\Program Files (x86)\Skype\Phone\;C:\WINDOWS\system32\config\systemprofile\.dnx\bin;C:\Program Files\Microsoft DNX\Dnvm\;C:\Program Files\Microsoft SQL Server\130\Tools\Binn\;C:\Program Files (x86)\apache-maven-3.3.9\bin;C:\Program Files\Java\jdk1.8.0_112\bin;C:\ProgramData\Oracle\Java\javapath;C:\Program Files\ISC BIND 9\bin;C:\Program Files\PostgreSQL\9.6\bin;C:\HashiCorp\Vagrant\bin;C:\Program Files\Oracle\VirtualBox;C:\msys64\usr\bin;C:\Program Files\Docker Toolbox;C:\nginx-1.12.0;C:\Program Files\MySQL\MySQL Utilities 1.6\;C:\Ruby24-x64\bin;C:\Program Files\Common Files\Microsoft Shared\Windows Live;C:\Program Files (x86)\Common Files\Microsoft Shared\Windows Live;C:\Program Files (x86)\NVIDIA Corporation\PhysX\Common;C:\Windows\system32;C:\Windows;C:\Windows\System32\Wbem;C:\Windows\System32\WindowsPowerShell\v1.0\;C:\Program Files (x86)\Windows Live\Shared;C:\Program Files\Intel\WiFi\bin\;C:\Program Files\Common Files\Intel\WirelessCommon\C:\MinGW\bin;c:\xampp\perl\bin\;c:\xampp\php\;c:\xampp\mysql\bin\;C:\ProgramData\ComposerSetup\bin;C:\ProgramData\chocolatey\bin;C:\Program Files\TortoiseGit\bin;C:\WINDOWS\system32;C:\WINDOWS;C:\WINDOWS\System32\Wbem;C:\WINDOWS\System32\WindowsPowerShell\v1.0\;C:\Program Files\nodejs\;C:\Program Files (x86)\Skype\Phone\;C:\WINDOWS\system32\config\systemprofile\.dnx\bin;C:\Program Files\Microsoft DNX\Dnvm\;C:\Program Files\Microsoft SQL Server\130\Tools\Binn\;C:\Program Files (x86)\apache-maven-3.3.9\bin;C:\Program Files\Java\jdk1.8.0_112\bin;C:\ProgramData\Oracle\Java\javapath;C:\msys64\usr;C:\Eclipse4.6\pleiades\eclipse;;.] [木 7 27 19:23:23 JST 2017]
情報: Initializing ProtocolHandler ["http-nio-8080"] [木 7 27 19:23:23 JST 2017]
情報: Using a shared selector for servlet write/read [木 7 27 19:23:23 JST 2017]
情報: Initializing ProtocolHandler ["ajp-nio-8009"] [木 7 27 19:23:23 JST 2017]
情報: Using a shared selector for servlet write/read [木 7 27 19:23:23 JST 2017]
情報: Initialization processed in 972 ms [木 7 27 19:23:23 JST 2017]
情報: サービス [Catalina] を起動します [木 7 27 19:23:23 JST 2017]
情報: Starting Servlet Engine: Apache Tomcat/9.0.0.M21 [木 7 27 19:23:23 JST 2017]
情報: Starting ProtocolHandler ["http-nio-8080"] [木 7 27 19:23:23 JST 2017]
情報: Starting ProtocolHandler ["ajp-nio-8009"] [木 7 27 19:23:23 JST 2017]
情報: Server startup in 448 ms [木 7 27 19:23:23 JST 2017]

「Server startup in ~」みたいな表示が出ていれば、サーバー(Tomcat)が起動しています。

で、さっそく見つからないという404エラーが!URLが間違ってるので、最後の『/』の後にsample.jspと追加。

f:id:ts0818:20170727180334j:plain

http://localhost:8080/プロジェクト名/sample.jsp」にアクセスして、sample.jspファイルが出力されればOK。

f:id:ts0818:20170727180333j:plain

サーバー(Tomcat)が起動してる間は、URLにアクセスするとページが表示されますが、サーバーを停止すると、アクセスできなくなります。

サーバーを停止するには、「サーバー」のビューの赤い四角ボタンをクリックします。

f:id:ts0818:20170727180335j:plain

停止しました。

f:id:ts0818:20170727180336j:plain

ブラウザを更新してみます。

f:id:ts0818:20170727180337j:plain

これは、Tomcatサーバーが停止したために、アクセスできなくなったためと思われます。

JSPについては、後日まとめていきたいと思います。 

jspファイルとServletファイルの連携

今度は、Servletファイルも作っていきたいと思います。

「パッケージ・エクスプローラー」のプロジェクト内の「src」を選択した状態で、右クリック「新規(W)」>「その他(O)...」を選択。

f:id:ts0818:20170727180338j:plain

「Web」>「サーブレット」を選択し、「次へ(N)>」をクリック。

f:id:ts0818:20170727180339j:plain

Javaパッケージ(K)」、「クラス名(M)」を入力し、「完了(F)」をクリック。

f:id:ts0818:20170727180340j:plain

ServletJavaファイル)ファイルが作成されました。

f:id:ts0818:20170727180341j:plain

package servlet;

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;

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

	/**
	 * @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());
	}

	/**
	 * @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);
	}

}
    

jspファイルとServletファイルを編集します。ObjectをListにキャストしてるところで警告が出るのであんまり宜しくなさそうです。

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ page import="java.util.*" %>
<%@ page import="java.io.*" %>
<!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>Insert title here</title>
</head>
<body>
  <form action="SampleServlet" method="POST">
    <p>氏名</p>
    姓 <input type="text" name="last-name" value="">
    名 <input type="text" name="first-name" value="">

    <p>性別</p>
    <input type="radio" name="gender" value="0" checked> 男性
    <input type="radio" name="gender" value="1"> 女性

    <p>趣味</p>
    <input type="checkbox" name="hobby" value="sports" checked> スポーツ
    <input type="checkbox" name="hobby" value="books" checked> 読書
    <input type="checkbox" name="hobby" value="movies" checked> 映画
    <input type="checkbox" name="hobby" value="music" checked> 音楽
    <input type="checkbox" name="hobby" value="cooking" checked> 料理

    <input type="submit" value="送信">
  </form>

  <hr>

  <ul>
  <%
  if(request.getAttribute("lists") != null) {
    List<String> lists = (List<String>)request.getAttribute("lists");
    for(String list: lists) {
  %>
	 <li><%= list %></li>
  <%
    }
  }
  %>
  </ul>
</body>
</html>    

 

package servlet;

import java.io.IOException;
import java.util.ArrayList;
import java.util.List;

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

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

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

  /**
   * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
   */
  protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

  }

  /**
   * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
   */
  protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
      request.setCharacterEncoding("UTF-8");
      List<String> lists = new ArrayList<String>();
      String last_name = request.getParameter("last-name");
      String first_name = request.getParameter("first-name");

      String gender = request.getParameter("gender");
      String hobbys[] = request.getParameterValues("hobby");

      lists.add(last_name);
      lists.add(first_name);
      lists.add(gender);
      for(String hobby: hobbys) {
        lists.add(hobby);
      }

      // 遷移先で、listsを使えるように
      request.setAttribute("lists", lists);

      // sample.jspへ
      getServletConfig().getServletContext()
                     .getRequestDispatcher("/sample.jsp")
                     .forward(request, response);

  }
}
    

サーバーで実行。入力して、「送信」すると、

f:id:ts0818:20170727180343j:plain

SampleServletを経由して、返ってきました。URLがSampleServletのままになってますが...。

f:id:ts0818:20170727180342j:plain

日本語が文字化けしてますが...。

2017年7月27日(木)22:30  追記

SampleServlet.javaのdoPost()メソッドに『request.setCharacterEncoding("UTF-8");』 を追記したら、文字化け解消されました。

f:id:ts0818:20170727180344j:plain