使用 Postman 上传二进制类型的图片到后端接口写法

我们有的时候会有需求，就是通过 postman 传递二进制图片到后端接口，如下图：

那我们的 Java 接口需要怎么写呢？

Spring Boot 接收这些数据的方式需要使用 @RequestBody 注解来处理原始的二进制数据（byte[]）。

1. 使用 @RequestBody 接收二进制数据

如果在 Postman 中选择了 binary，那么将直接上传文件的二进制数据。可以在 Spring Boot 中通过 @RequestBody 来接收这些二进制数据，并将其保存为文件。

2. Controller 代码示例

下面是一个简单的 Spring Boot 控制器，用于接收 Postman 上传的图片并保存到本地磁盘：

import org.springframework.web.bind.annotation.*;
import org.springframework.http.ResponseEntity;

import java.io.File;
import java.io.FileOutputStream;
import java.io.IOException;

@RestController
@RequestMapping("/api/upload")
public class FileUploadController {

    private static final String UPLOAD_DIR = "uploads/";

    @PostMapping("/image")
    public ResponseEntity<String> uploadImage(@RequestBody byte[] fileBytes) {
        // 判断文件是否为空
        if (fileBytes.length == 0) {
            return ResponseEntity.badRequest().body("No file uploaded");
        }

        try {
            // 保存文件到服务器指定路径（这里假设保存为 uploaded_image.jpg）
            File dest = new File(UPLOAD_DIR + "uploaded_image.jpg");

            // 确保目标目录存在
            dest.getParentFile().mkdirs();

            // 写入文件
            try (FileOutputStream fos = new FileOutputStream(dest)) {
                fos.write(fileBytes);
            }

            return ResponseEntity.ok("File uploaded successfully: " + dest.getName());
        } catch (IOException e) {
            return ResponseEntity.status(500).body("File upload failed: " + e.getMessage());
        }
    }
}

3. 详细说明

1. @RequestBody byte[] fileBytes:

   • @RequestBody 用于接收请求体中的数据，Postman 发送的二进制数据将被自动映射为 byte[] 数组。

2. 保存文件:

   • 文件会被保存到 uploads/ 目录下，可以根据需要修改保存路径和文件名。
   • 如果目标文件夹不存在，会自动创建。

3. 返回响应:

   • 如果文件上传成功，会返回 “File uploaded successfully”。
   • 如果上传失败，会返回错误信息。

4. 配置文件上传大小（可选）

   • 如果你的文件比较大，可以在 application.properties 或 application.yml 中设置上传文件的最大大小。例如：

# 设置文件上传的最大大小
spring.servlet.multipart.max-file-size=10MB
spring.servlet.multipart.max-request-size=10MB

---

扩展：

我使用 postman 传二进制类型图片到后端的时候遇到一个坑，可以参考这篇文章 - 《使用 postman 传递 binary 类型的图片到后端接口遇到的坑》

---

扩展：

前端如何传递二进制图片到后端接口？

info 是使用 Antd 的 Upload 的 Dragger 的 onChange 回调参数，参考 Antd 官方文档 - Upload 上传

const updateLoad = (info) => {
    const file = info.file;

    // 使用 FileReader 来读取文件为二进制数据
    const reader = new FileReader();

    reader.onload = () => {
      // 获取二进制数据（ArrayBuffer）
      const binaryData = reader.result;
	  sendRequest(binaryData).then((res) => {
          if (res) {
            setUploadFile(res);
          }
      }).catch((err) => {
          showErrorMsg(err);
      });
    };

    // 读取文件为 ArrayBuffer（二进制）
    reader.readAsArrayBuffer(file);
  }