thymeleafは画像urlを使用するか、ローカル画像をアップロードします.

プロファイル:

#               
file.upload.path=F://images/
file.upload.path.relative=/images/**

構成クラス:

import org.springframework.beans.factory.annotation.Value;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.ResourceHandlerRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;

//  WebMvcConfigurer  mvc
//          
@Configuration
public class MyMvcConfig implements WebMvcConfigurer {
     
    //    
    @Value("${file.upload.path}")
    private String filePath;

    //      
    @Value("${file.upload.path.relative}")
    private String fileRelativePath;

    /**
     *       
     */
    @Override
    public void addResourceHandlers(ResourceHandlerRegistry registry) {
     
        registry.addResourceHandler(fileRelativePath).addResourceLocations("file:/" + filePath);
    }
}

エンティティクラスPicture.java

package com.ckh.springboot04.entities;


import lombok.Data;
import org.springframework.data.annotation.CreatedDate;
import org.springframework.data.annotation.LastModifiedDate;
import org.springframework.data.jpa.domain.support.AuditingEntityListener;

import javax.persistence.*;
import java.util.Date;

@Entity
@Data
@Table(name = "pic_info")
@EntityListeners(AuditingEntityListener.class)
public class Picture {
     

    @Id
    @GeneratedValue
    private Integer picId;
    private String picUrl;//      
    private String picDesc;//    

    @CreatedDate//           
    private Date createTime;
    @LastModifiedDate//           
    private Date updateTime;
}

フロントエンド追加ページ:アップロード画像urlまたはローカル選択画像:

	
<form th:action="@{/pic}" method="post" enctype="multipart/form-data">
	<div class="form-group">
		<label for="picUrl">     label>
		<input name="picUrl" type="text" class="form-control" id="picUrl"
			   th:value="${pic} != null ? ${pic.picUrl}"
			   placeholder="url">
	div>
	
	
	<div class="form-group">
		<label for="uploadFile">         label>
		<input type="file" class="form-control-file" id="uploadFile" name="imgFile">
	div>
form>

コントロール層:

/*
  *     
  *   picture  ，save    ，redirect "/pictures"      
  * */
  @PostMapping("/pic")
  public String addPic(Picture picture, @RequestParam("imgFile") MultipartFile file){
     
      System.out.println("        ：");
      System.out.println(picture);

      //        
      String filename = file.getOriginalFilename();
      //        ，picture picUrl='',         picUrl
      if (!"".equals(filename)){
     
          //           
          //String path = "F:\\java\\workspace\\spring-boot-04-web-restfulcrud\\src\\main\\resources\\static\\asserts\\img";
          String path = filePath + "uploadImages/";
          //     
          File filepath = new File(path, filename);
          //         ，          
          if (!filepath.getParentFile().exists()) {
     
              filepath.getParentFile().mkdirs();
          }
          try {
     
              //     
              file.transferTo(new File(path + File.separator + filename));
          } catch (IOException e) {
     
              e.printStackTrace();
          }

          //         picUrl
          //String picUrl = "http://localhost:8081/seller/asserts/img/" + filename;
          String picUrl = "/images/uploadImages/" + filename;
          picture.setPicUrl(picUrl);
      }

      Picture save = pictureRepository.save(picture);

      System.out.println("     ：");
      System.out.println(save);
      return "redirect:/pictures";
  }

フロントエンドの画像:

<td><img height="50" width="50" th:src="@{${pic.picUrl}}" alt="">td>

注意!th:src="@{${pic.picUrl}}",ローカルピクチャを表示するには,srcを@{}で包む必要がある!!
参照先:https://www.cnblogs.com/zhainan-blog/p/11169163.html