[Spring] View에서 Thymeleaf 문법을 이용하여 url 링크로 이미지 업로드하기 (img th:src)

Thymeleaf Template Engine 문법(img th:src)을 이용해 이미지를 View에 업로드해보자

기존 html 에서 image url 값을 통해 이미지를 시각적으로 나타내기 위해서는 <img src = "https://url.."> 와 같은 형태를 사용했다.

Thymeleaf Template Engine을 사용해 이미지를 업로드 할 때는 Thymeleaf 문법을 어떻게 사용해야 할까?

String 타입의 url 링크를 받아온 값에 대해, <img th:src="@{${data.img}}" alt="" /> 와 같이 사용해주면 된다.

<tr th:each="result : ${results}">
  <td> <span style="font-weight:bold" th:text="${result.title}"> Title </span></td>
  <td>
    <img th:src="@{${result.coverLink}}" alt="no image"/>
  </td>
  
  <!-- -->
  
  </tr>

아래와 같이 로컬에서 테스트했을 때, View 결과 화면에서 이미지가 잘 나타나는 것을 확인할 수 있다.