質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
Java

Javaは、1995年にサン・マイクロシステムズが開発したプログラミング言語です。表記法はC言語に似ていますが、既存のプログラミング言語の短所を踏まえていちから設計されており、最初からオブジェクト指向性を備えてデザインされています。セキュリティ面が強力であることや、ネットワーク環境での利用に向いていることが特徴です。Javaで作られたソフトウェアは基本的にいかなるプラットフォームでも作動します。

Spring Boot

Spring Bootは、Javaのフレームワークの一つ。Springプロジェクトが提供する様々なフレームワークを統合した、アプリケーションを高速で開発するために設計されたフレームワークです。

Q&A

解決済

1回答

12735閲覧

springboot 画像を表示したい

Yoshi--

総合スコア62

Java

Javaは、1995年にサン・マイクロシステムズが開発したプログラミング言語です。表記法はC言語に似ていますが、既存のプログラミング言語の短所を踏まえていちから設計されており、最初からオブジェクト指向性を備えてデザインされています。セキュリティ面が強力であることや、ネットワーク環境での利用に向いていることが特徴です。Javaで作られたソフトウェアは基本的にいかなるプラットフォームでも作動します。

Spring Boot

Spring Bootは、Javaのフレームワークの一つ。Springプロジェクトが提供する様々なフレームワークを統合した、アプリケーションを高速で開発するために設計されたフレームワークです。

0グッド

0クリップ

投稿2017/07/04 09:53

Profile.java

java

1package com.example.konkatsu.domain; 2 3import java.sql.Date; 4 5import javax.persistence.Entity; 6import javax.persistence.GeneratedValue; 7import javax.persistence.Id; 8import javax.persistence.Table; 9 10import lombok.AllArgsConstructor; 11import lombok.Data; 12import lombok.NoArgsConstructor; 13 14@Data 15@NoArgsConstructor //デフォルトコンストラクタも必要な場合 16@AllArgsConstructor //すべてのフィールドを引数に持つコンストラクタを自動生成 17@Entity //エンティティ(一単位として扱われるデータのまとまり)であることを示す。指定したクラス名がテーブルとマッピングされる 18@Table(name = "profile") //接続するテーブルを指定 19public class Profile { 20 @Id //主キー 21 @GeneratedValue //自動採番される 22 private Integer userId; 23 private Integer genderId; 24 private String name; 25 private Date birthday; 26 private Integer height; 27 private Integer occupationId; 28 private Integer income; 29 private String text; 30 private byte[] image; 31 // @ManyToOne(fetch = FetchType.LAZY) 32 //@JoinColumn(nullable = true, name = "userId") 33 //private User user; 34 35} 36

ProfileForm.java

java

1//プロフィールフォームに関するクラス 2//このクラスにhtmlの<form>から送るパラメータをマッピングさせる 3 4 5package com.example.konkatsu.web; 6 7import java.sql.Date; 8 9import javax.validation.constraints.NotNull; 10 11import lombok.Data; 12 13@Data 14public class ProfileForm { 15 @NotNull 16 private String name; 17 @NotNull 18 private Date birthday; 19 @NotNull 20 private Integer height; 21 @NotNull 22 private Integer occupationId; 23 @NotNull 24 private Integer income; 25 @NotNull 26 private String text; 27 @NotNull 28 private byte[] image; 29} 30

profileList.html

html

1<!DOCTYPE html> 2<html xmlns:th="http://www.thymeleaf.org"> 3<head> 4 <meta charset="utf-8"/> 5 <title>婚活サイト</title> 6 <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" 7 th:href="@{/webjars/bootstrap/3.3.7/css/bootstrap.min.css}"/> 8 <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" 9 th:href="@{/webjars/bootstrap/3.3.7/css/bootstrap-theme.min.css}"/> 10</head> 11 12<body> 13 14 <table class="table table-striped table-bordered table-condensed"> 15 <h2>登録ユーザー</h2> 16 <tr> 17 <th>名前</th> 18 <th>誕生日</th> 19 <th>身長(cm)</th> 20 <th>職業</th> 21 <th>年収</th> 22 <th>自己紹介</th> 23 24 </tr> 25 <tr th:each="profile : ${profile}"> 26 <td th:text="${profile.name}">山田</td> 27 <td th:text="${profile.birthday}">山田</td> 28 <td th:text="${profile.height}">山田</td> 29 <td th:text="${profile.occupationId}">山田</td> 30 <td th:text="${profile.income}">山田</td> 31 <td th:text="${profile.text}">山田</td> 32 <td th:="${profile.image}">画像</td> 33 34 </tr> 35 </table> 36 37 <form th:action="@{/konkatsu/login}" method="get"> 38 <input type="submit" class="btn btn-default" name="goLogin" value="ログインフォームへ"/> 39 </form> 40</body> 41</html> 42 43

イメージ説明
このDBのimageを
イメージ説明

の”画像”の部分に表示させたいのですが
<td th:="${profile.image}">画像</td>
のところをどう書けばいいのでしょうか??

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

Thymeleafは標準ではバイナリ形式のデータ出力はできませんし、ブラウザも困ります。

以下の2つの方法がありますので、どれかを使うと良いでしょう。

(1)th:srcなどで画像出力するためのControllerを呼び出し、かつ画像を一意に特定できるパラメータを指定して、Controllerから別途画像のバイナリデータのみをレスポンスするようにする

(2)BASE64形式に変換したものを出力する(画像ファイルが1KB程度の小さいもので利用する)

BASE64形式で画像を表示する方法については base64 画像 などで検索すれば出てくるでしょう。

投稿2017/07/04 11:23

A-pZ

総合スコア12011

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問