Thymeleaf를 사용하여 HTML 페이지에 이미지를 추가하는 방법은 무엇입니까?-Java-php.cn

php 편집기 Xigua는 이 기사에서 Thymeleaf를 사용하여 HTML 페이지에 이미지를 추가하는 방법을 소개합니다. Thymeleaf는 HTML 페이지에서 동적 데이터를 사용할 수 있게 해주는 널리 사용되는 서버 측 Java 템플릿 엔진입니다. 이미지 추가는 웹 디자인의 일반적인 요구 사항이며 Thymeleaf는 이러한 목표를 달성하기 위해 간단하면서도 강력한 기능을 제공합니다. 다음 콘텐츠에서는 Thymeleaf 태그와 표현식을 사용하여 이미지를 참조하고 표시하는 방법을 알아봅니다. 초보자이든 숙련된 개발자이든 이 문서에서는 HTML 페이지에 이미지를 쉽게 추가하는 데 유용한 지침을 제공합니다.

질문 내용

내 문제는 내 백리향 블록이 HTML 페이지에 이미지와 바로가기 아이콘을 표시하지 않는다는 것입니다

파일 경로를 사용해 보았습니다:

으아악

그리고 나머지 API도 사용해 보았습니다.

으아악

컨트롤러 포함:

으아악

그리고 항상 이미지 대신 Alt를 받습니다...

해결 방법

문제 1: 파일을 올바르게 읽음

기본 구성을 사용하는 경우src/main/resources的任何内容都会复制到类路径中。因此，您不应在代码中引用src/main/resources를 대신 입력하면 클래스 경로 자체를 참조할 수 있습니다.

로컬에서 실행하면 여전히 작동할 수 있지만 다른 곳에서 jar 파일을 실행하면 완전히 충돌이 발생합니다.

따라서 이상적으로는 컨트롤러를 다음과 같이 다시 작성해야 합니다.

으아악

파일에서 리소스를 검색하는 것은 일반적인 작업이므로 실제로 바이트를 읽을 필요는 없습니다.filesystemresource代替bytearrayresource:

을 사용할 수 있습니다. 으아악

클래스 경로에서 리소스를 검색하는 것이 너무 일반적이어서classpathresource클래스가 있으므로 이 시간을 단축할 수도 있습니다.

으아악

그게 다가 아닙니다. 일반적으로 클래스 경로에서 웹 리소스를 제공해야 하므로 스프링 부트에서는 컨트롤러 메서드 없이classpath:static/文件夹或classpath:public/文件夹中的所有内容都已经在网络。所以通常情况下，您的图像已经可以在http://localhost:8080/logo.png가 사용됩니다.

따라서 일반적으로 해당 컨트롤러 메서드를 완전히 제거할 수 있습니다.

질문 2: 파일을 올바르게 인용

이것은 두 번째 질문으로 이어집니다. 현재@{/api/v1/logo}或@{src/main/resources/static/logo.png}를 사용하여 이미지를 참조하고 있습니다. 타임리프는@{path/to/file}解释为上下文相关 url，因此它唯一做的就是在上下文路径前面添加上下文路径（如果有的话）并期望该文件在http://localhost:[serverport ]/[contextpath]/path/to/file.

하지만 이전에 설정한 대로 이미지는http://localhost:8080/logo.png上找到，因此，您应该使用@{/logo.png}:

에서 사용할 수 있어야 합니다. 으아악

이 방법이 작동하지 않으면 다음을 수행하세요.