Java实现小程序图片上传与存储 小程序图片管理后台搭建方法

wx.chooseImage({
  count: 1, // 最多选择一张图片
  sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
  sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
  success (res) {
    const tempFilePaths = res.tempFilePaths
    wx.uploadFile({
      url: 'https://yourdomain.com/api/uploadImage', // 替换为你的后端上传接口
      filePath: tempFilePaths[0],
      name: 'file', // 对应后端MultipartFile的参数名
      formData: {
        'userId': 'user123', // 示例：可以携带用户ID等信息
        'category': 'avatar'
      },
      success (uploadRes) {
        const data = JSON.parse(uploadRes.data)
        console.log('上传成功', data.imageUrl)
        // 在这里处理上传成功后的逻辑，比如显示图片或保存图片URL
      },
      fail (err) {
        console.error('上传失败', err)
      }
    })
  }
})

<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-web</artifactId>
</dependency>
<dependency>
    <groupId>com.aliyun.oss</groupId>
    <artifactId>aliyun-sdk-oss</artifactId>
    <version>3.15.0</version>
</dependency>
<!-- 如果需要数据库存储图片元数据 -->
<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-data-jpa</artifactId>
</dependency>
<dependency>
    <groupId>mysql</groupId>
    <artifactId>mysql-connector-java</artifactId>
    <scope>runtime</scope>
</dependency>

import com.aliyun.oss.OSS;
import com.aliyun.oss.OSSClientBuilder;
import org.springframework.beans.factory.annotation.Value;
import org.springframework.http.ResponseEntity;
import org.springframework.web.bind.annotation.*;
import org.springframework.web.multipart.MultipartFile;

import java.io.IOException;
import java.io.InputStream;
import java.util.HashMap;
import java.util.Map;
import java.util.UUID;

@RestController
@RequestMapping("/api")
public class ImageUploadController {

    @Value("${oss.endpoint}")
    private String endpoint;
    @Value("${oss.accessKeyId}")
    private String accessKeyId;
    @Value("${oss.accessKeySecret}")
    private String accessKeySecret;
    @Value("${oss.bucketName}")
    private String bucketName;
    @Value("${oss.baseUrl}") // 你的OSS访问域名
    private String baseUrl;

    @PostMapping("/uploadImage")
    @CrossOrigin // 允许跨域请求，小程序默认是跨域的
    public ResponseEntity<Map<String, String>> uploadImage(@RequestParam("file") MultipartFile file,
                                                           @RequestParam(value = "userId", required = false) String userId,
                                                           @RequestParam(value = "category", required = false) String category) {
        if (file.isEmpty()) {
            return ResponseEntity.badRequest().body(createErrorResponse("文件为空"));
        }

        // 简单的文件类型校验，实际应用中应更严格
        if (!file.getContentType().startsWith("image/")) {
            return ResponseEntity.badRequest().body(createErrorResponse("只允许上传图片文件"));
        }

        String originalFilename = file.getOriginalFilename();
        String fileExtension = originalFilename.substring(originalFilename.lastIndexOf("."));
        String uniqueFileName = UUID.randomUUID().toString() + fileExtension; // 生成唯一文件名

        OSS ossClient = new OSSClientBuilder().build(endpoint, accessKeyId, accessKeySecret);
        try (InputStream inputStream = file.getInputStream()) {
            ossClient.putObject(bucketName, uniqueFileName, inputStream);
            String imageUrl = baseUrl + "/" + uniqueFileName;

            // 这里可以添加将图片URL及其他元数据保存到数据库的逻辑
            // imageService.saveImageMetadata(imageUrl, originalFilename, userId, category);

            Map<String, String> response = new HashMap<>();
            response.put("code", "0");
            response.put("message", "上传成功");
            response.put("imageUrl", imageUrl);
            return ResponseEntity.ok(response);
        } catch (IOException e) {
            e.printStackTrace();
            return ResponseEntity.status(500).body(createErrorResponse("文件上传失败: " + e.getMessage()));
        } finally {
            if (ossClient != null) {
                ossClient.shutdown();
            }
        }
    }

    private Map<String, String> createErrorResponse(String message) {
        Map<String, String> response = new HashMap<>();
        response.put("code", "-1");
        response.put("message", message);
        return response;
    }
}

// ImageService.java (示例，实际中会有更多业务逻辑)
@Service
public class ImageService {
    @Autowired
    private ImageRepository imageRepository; // 假设你有一个JPA Repository

    public Page<ImageMetadata> listImages(Pageable pageable) {
        return imageRepository.findAll(pageable);
    }

    public void deleteImage(Long id) {
        // 1. 从数据库删除元数据
        imageRepository.deleteById(id);
        // 2. 从OSS/S3删除实际文件 (根据imageUrl解析出objectKey)
        // OSS ossClient = new OSSClientBuilder().build(...);
        // ossClient.deleteObject(bucketName, objectKey);
    }
}

@RestController
@RequestMapping("/admin/images")
public class ImageAdminController {

    @Autowired
    private ImageService imageService;

    @GetMapping
    public ResponseEntity<Page<ImageMetadata>> getImages(@RequestParam(defaultValue = "0") int page,
                                                         @RequestParam(defaultValue = "10") int size) {
        Pageable pageable = PageRequest.of(page, size, Sort.by("uploadTime").descending());
        return ResponseEntity.ok(imageService.listImages(pageable));
    }

    @DeleteMapping("/{id}")
    public ResponseEntity<Void> deleteImage(@PathVariable Long id) {
        imageService.deleteImage(id);
        return ResponseEntity.noContent().build();
    }
}