画像ファイルをBASE64形式でエンコード

Question

@GetMapping(path = "myProfile")   //pathの指定がない場合は URL は/konkatsu
	String MyList(@RequestParam Integer id, Model model){  //SpringMVCでは画面に値を渡す為にModelオブジェクトを使用
		Profile profile = profileService.findProfile(id);

		//画像ファイルをBASE64形式でエンコード
		String encodedImage = Base64.getEncoder().encodeToString(profile.getImage());
		System.out.println(encodedImage);

		model.addAttribute("image", encodedImage);
		model.addAttribute("profile", profile);  //第一引数はThymeleafで取り出す時に使う名前、第二引数はThymeleafに渡したいオブジェクトを指定
		return "konkatsu/myProfile";   //遷移する画面の名前
	}

  <td><img th:src="${'data:image/png;base64,' + image}" width="250" height="150"/></td>
          <td th:text="${profile.name}">山田</td>
          <td th:text="${profile.gender.gender}">山田</td>
          <td th:text="${profile.birthday}">仮</td>
          <td th:text="${profile.height}">仮</td>
          <td th:text="${profile.occupation.occupationName}">仮</td>
          <td th:text="${profile.income}">仮</td>
          <td th:text="${profile.user.mail}">duke</td> 
          <td th:text="${profile.text}">仮</td>

この場合、
画像が画面に表示されるのですが

どのように書き換えたら良いのでしょうか？？？
この理論であっていますか？？

String encodedImage = Base64.getEncoder().encodeToString(ここにリストProfileのimageを入れたいのです));

         <tr th:each="profile : ${profile}">
           					<!-- エンコードした画像の表示 -->
	      <td><img th:src="${'data:image/png;base64,' + image}" width="250" height="150"/></td>
          <td th:text="${profile.name}">山田</td>
          <td th:text="${profile.gender.gender}">山田</td>
          <td th:text="${profile.birthday}">仮</td>
          <td th:text="${profile.height}">仮</td>
          <td th:text="${profile.occupation.occupationName}">仮</td>
          <td th:text="${profile.income}">仮</td>
          <td th:text="${profile.user.mail}">duke</td>  <!-- 「profile」オブジェクトがもつ「user」の「mail」を表示 -->
          <td th:text="${profile.text}">仮</td>
        </tr>

同じような形で

ListのProfileで登録ユーザー一覧に画像を表示したい場合

		@GetMapping(path = "usersList")   
	String usersList(@RequestParam Integer genderId, Model model){  
		List<Profile> profile = profileService.findUsers(genderId);

		
      String encodedImage = Base64.getEncoder().encodeToString(profile.getImage());
		System.out.println(encodedImage);

		model.addAttribute("image", encodedImage);
		model.addAttribute("profile", profile);  
       return "konkatsu/profileList";   
	}

profile.getImage()でエラーとなってしまいます
List Profileに格納されているimageを出力したいです

Comments

[A-pZ]

コメントアウトした不要な行は削除しましょう。

[Yoshi--]

失礼いたしました、修正いたしました

Answer 1

Listなどの内容を繰り返して表示する場合には、th:each を使うと良いでしょう。

Comments

[Yoshi--]

htmlを追加いたしました。th:eachを使っているのですが
List の profileに格納されている画像ファイルがBASE64形式でエンコード
されていないため表示できないことが現状でございます

[A-pZ]

表示したい内容がControllerで渡しているコードがありませんが、List<Profile> の形で取得した内容を、model.addAttribute で格納していますか？

また、th:each="profile : ${profile}" と、同じ名前をつけてはいけません。th:eachは複数行の内容を表示するものですから、Controllerで格納するときはきちんと複数行である名前をつけるなどしましょう。例えば、profilesやprofileListです。

th:eachの使い方ついては、th:each で検索するとさまざまなサンプルが見つかるでしょう。

[Yoshi--]

list<Profile>のjavaを
修正いたしました。

そのControllerのところで分からなくなっております

list<Profile>のとき

String encodedImage = Base64.getEncoder().encodeToString(profile.getImage());

profile.getImage()でエラーになってしまいます。

listの場合の書き方は違うものなのでしょうか？？

[A-pZ]

Listなのだから複数のProfileが入っていますよね。ご自身で記載している Base64.getEncoder().encodeToString(profile.getImage()); は単一の画像に対して文字列を得る処理なのですから、画像ごとに繰り返せば良いのではないでしょうか。

[Yoshi--]

返答ありがとうございます。
つまりは同じように単一の画像の書き方で書いて

それを繰り返すということでしょうか？？