JSPで実行するとhtmlのタグが表示されてしまう

###前提・実現したいこと
★環境
eclipse(JavaEE版)
tomcat(v7.0)
JDBC(v5.1.39)
MySQL(v5.7.12)
*あらかじめ以下のようなDBを作成済。
DB名 = Japan
TABLE名 = Kanto
+------+-------------+
| ID | Prefectures |
+------+-------------+
| 1 | 東京 |
| 2 | 千葉 |
| 3 | 神奈川 |
+------+-------------+

★期待動作
スクショのように、JDBCでMySQLからデータを取得し、表示するJSPを作りたいのです。

###発生している問題・エラーメッセージ
JSPファイルにて、以下のように<%>〜<%>で括るとjavaソースが書ける認識です。

html
1<body>
2 <%
3 javaソース
4 javaソース
5 javaソース
6 <%>
7</body>

ところが、以下のソースではhtmlのソースが表示されてしまいます。

html
1<%@ page language="java" contentType="text/html; charset=UTF-8"
2	pageEncoding="UTF-8" import="java.sql.*"%>
3
4<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
5<html>
6<head>
7<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
8<title>ShowDB</title>
9</head>
10<body>
11★ここから手を入れました★
12<h1>県庁所在地（関東）</h1>
13<table border=1>
14<tr>
15<th>都道府県名</th><th>県庁所在地</th>
16</tr>
17
18<%
19Connection connection = null;
20Statement statement = null;
21ResultSet resultSet = null;
22
23Class.forName("com.mysql.jdbc.Driver").newInstance();
24
25connection = DriverManager.getConnection("jdbc:mysql://localhost/Japan?user=root&password=20050168");
26statement = connection.createStatement();
27resultSet = statement.executeQuery("SELECT ID,Prefectures FROM Kanto");
28response.setContentType("text/plain");
29
30while(resultSet.next()){
31	out.println("<tr>");
32	String ID = resultSet.getString("ID");
33	String Prefectures = resultSet.getString("Prefectures");
34	response.getWriter().println("<td>" + ID + "</td>" + "<td>" + Prefectures + "</td>");
35	out.println("</tr>");
36}
37%>
38</table>
39</body>
40</html>

###試したこと
<%>〜<%>をコメントアウトし、以下のように表示させたい内容をベタ打ちすると期待動作になります。

html
1<body>
2 <h1>都道府県名（関東）</h1>
3 <table border=1>
4  <tr>
5   <th>No</th><th>都道府県名</th>
6  </tr>
7  <tr>
8   <td align="center">1</td><td align="center">東京</td>
9  </tr>
10  <tr>
11   <td align="center">2</td><td align="center">千葉</td>
12  </tr>
13  <tr>
14   <td align="center">3</td><td align="center">神奈川</td>
15  </tr>
16 </table>
17</body>

上記、<%>〜<%>で括ってJDBCを使い、DBからデータを取得したいのです。
どのようにしたら期待動作のようになるか、解決策をご教示ください。
情報が不足している点については、お手数ですがご指摘ください。

行動規範の内容に同意します

回答1件

ベストアンサー

解決方法

tdタグの出力部分のresponse.getWriter()をoutに置き換えればいいはずです。

jsp
1out.println("<td>" + ID + "</td>" + "<td>" + Prefectures + "</td>");

HTMLタグが表示される理由

HTMLの宣言を表す<!DOCTYPE html>より前に、tdタグが出力されたからです。
この状態だとブラウザはhtmlファイルとは認識しないので、textファイルの中身がそのまま表示されてしまいます。

tdタグがファイルの先頭に出力された理由

response.getWriter()を使ったからです。

投稿2016/08/13 05:09

yuji38kwmt

総合スコア437

Wassermann

2016/08/13 15:36

yuji38kwmt先生ご指導くださいましてありがとうございます！ただ、仰るように以下のbefore/afterで対応しましたが期待動作にはなりませんでした。 ■before/after-------- <before> response.getWriter().println("<td>" + ID + "</td>" + "<td>" + Prefectures + "</td>"); <after> out.println("<td>" + ID + "</td>" + "<td>" + Prefectures + "</td>"); --------------------- なお、yuji38kwmt先生からいただいた内容をよく考えたところ、以下の点に気づきました。・<meta http-equiv="Content-Type" content="text/html;>でもhtmlだと宣言している。・なのに、「response.setContentType("text/plain");」はただの文字列として　宣言している。このresponseとは何か調べたところ、以下の記述を見つけました。 ----------------------- 参考)http://www.kab-studio.biz/Programing/JavaA2Z/Word/00000824.html ・responseはHttpServletResponseインターフェイスの変数である。・responseは「JSP暗黙オブジェクト」の1つであり、<%>〜<%>内で使用できる。・「response」の名の通り、リクエストに対して返される情報を扱う。・HttpServletResponseインターフェイスのgetWriter()メソッドで　PrintWriterクラスの参照を取得でき、PrintWriterクラスのprintln()メソッドで　HTMLを出力することができる。・ただし、JSP暗黙オブジェクト「out」がこれと全く同じもののため、実際には必要ない。 ----------------------- →最後が衝撃的な一文でしたので、ソースを以下に変更したら期待動作になりました！ ■before---------------- response.setContentType("text/plain"); <省略> response.getWriter().println("<td>" + ID + "</td>" + "<td>" + Prefectures + "</td>"); ---------------------------- ■after------------------- // response.setContentType("text/plain"); <省略> out.println("<td>" + ID + "</td>" + "<td>" + Prefectures + "</td>"); ---------------------------- yuji38kwmt先生が気づかせてくださったからこそ、解決に至ることができました。またご縁がございましたら、ご指導くださいますと幸いです。この度はヒントをくださいまして、ありがとうございました！

行動規範の内容に同意します