vue+springboot上传下载图片代码如何实现

首先，前端部分可以使用Vue.js框架中的axios库来发送POST请求并上传图片。后端部分可以使用Spring Boot框架中的MultipartFile来处理上传的图片，并使用ResponseEntity返回下载的图片。

以下是一个简单的示例代码：

前端部分：

<template>
  <div>
    <input type="file" ref="fileInput" @change="handleFileUpload">
    <button @click="uploadFile">上传</button>
    <button @click="downloadFile">下载</button>
  </div>
</template>

<script>
import axios from 'axios'

export default {
  name: 'ImageUpload',
  data() {
    return {
      file: null
    }
  },
  methods: {
    handleFileUpload(event) {
      this.file = event.target.files[0]
    },
    uploadFile() {
      let formData = new FormData()
      formData.append('file', this.file)
      axios.post('/api/upload', formData)
        .then(response => {
          console.log(response)
        })
        .catch(error => {
          console.log(error)
        })
    },
    downloadFile() {
      axios.get('/api/download', { responseType: 'blob' })
        .then(response => {
          const url = window.URL.createObjectURL(new Blob([response.data]))
          const link = document.createElement('a')
          link.href = url
          link.setAttribute('download', 'image.jpg')
          document.body.appendChild(link)
          link.click()
        })
        .catch(error => {
          console.log(error)
        })
    }
  }
}
</script>

后端部分：

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

  @PostMapping("/upload")
  public ResponseEntity<?> uploadImage(@RequestParam("file") MultipartFile file) {
    // 处理上传的图片
    return ResponseEntity.ok().build();
  }

  @GetMapping("/download")
  public ResponseEntity<byte[]> downloadImage() throws IOException {
    // 处理下载的图片
    HttpHeaders headers = new HttpHeaders();
    headers.setContentType(MediaType.IMAGE_JPEG);
    headers.setContentDispositionFormData("attachment", "image.jpg");
    byte[] bytes = Files.readAllBytes(Paths.get("path/to/image.jpg"));
    return new ResponseEntity<>(bytes, headers, HttpStatus.OK);
  }
}

需要注意的是，这只是一个简单的示例代码，实际应用中还需要添加异常处理、文件存储等相关功能。