无法使用 Spring 引导 REST 服务将 BLOB 保存到数据库

Cannot save BLOB to database by using Spring Boot REST service

我尝试从前端发送一个包含 BLOB 变量的 Json 对象:

imageToBlob(file).then(result =>{

              const imageData={blobData: result} //JSON DATA
                   
              axios.post('http://localhost:8080/saveImage', imageData)
                        .then();
                })

当我记录 结果 时,浏览器打印:

Blob {size: 67386, type: 'image/png'}
size: 67386
type: "image/png"
[[Prototype]]: Blob

当我尝试将其保存到 MySQL 数据库时,我在 Spring 中收到此错误:

[nio-8080-exec-9] .w.s.m.s.DefaultHandlerExceptionResolver : Resolved [org.springframework.http.converter.HttpMessageNotReadableException: JSON parse error: Cannot deserialize value of type `[B` from Object value (token `JsonToken.START_OBJECT`); nested exception is com.fasterxml.jackson.databind.exc.MismatchedInputException: Cannot deserialize value of type `[B` from Object value (token `JsonToken.START_OBJECT`)<EOL> at [Source: (org.springframework.util.StreamUtils$NonClosingInputStream); line: 1, column: 13] (through reference chain: com.example.pictureprojecttestbackend.entity.Picture["blobData"])]

实体:

@Getter
@Setter
@NoArgsConstructor
@AllArgsConstructor
@Entity
public class Picture {
    @Id
    @GeneratedValue(strategy = GenerationType.AUTO)
    Integer id;

    @Lob
    byte[] blobData;
}

POST 请求:

@RestController
public class PictureController {

    @Autowired
    PictureRepository pictureRepository;

    @PostMapping(value = "/saveImage", consumes = "application/json")
    public void addImage(@RequestBody Picture picture){

        pictureRepository.save(picture);
    }
}

我做错了什么?我发送的 Json 结构有误还是实体有问题?

文件是字节数组,通常不能轻易转换为 JSON。这是您尝试执行的操作,但在此转换过程中失败了。

你最好用 content-type "multipart/form-data"

发送文件

尝试以下方法

@Lob
@Type(type = "org.hibernate.type.ImageType")
byte[] blobData;

然后

    @PostMapping(value = "/saveImage")
    public void addImage(@RequestParam("file") MultipartFile file){

      Picture picture = new Picture();
      picture.setBlobData(file.getBytes());

      pictureRepository.save(picture);
    }

然后调整你的前端

imageToBlob(file).then(result =>{

              var file = result;
              var formData = new FormData();
              formData.append("file", file);
                    
              axios.post('http://localhost:8080/saveImage', formData,  
                { headers: { 'Content-Type': 'multipart/form-data' } });
                    .then();
    });