vue前端下载文件,java后端

vue前端

html 复制代码
<template>
  <div>
    <button @click="downloadFile">Download File</button>
  </div>
</template>

<script>
import axios from 'axios';

export default {
  methods: {
    async downloadFile() {
      try {
        const response = await axios.get('http://your-backend-url/download', {
          responseType: 'blob' // 告诉axios响应的数据类型为Blob
        });
        const blob = new Blob([response.data], { type: 'application/octet-stream' });
        const url = window.URL.createObjectURL(blob);
        const link = document.createElement('a');
        link.href = url;
        link.setAttribute('download', 'filename.ext'); // 设置下载文件的文件名
        document.body.appendChild(link);
        link.click();
        document.body.removeChild(link);
      } catch (error) {
        console.error('Error downloading file:', error);
      }
    }
  }
}
</script>

java后端代码

java 复制代码
import org.springframework.core.io.Resource;
import org.springframework.core.io.UrlResource;
import org.springframework.http.HttpHeaders;
import org.springframework.http.MediaType;
import org.springframework.http.ResponseEntity;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;

import java.io.IOException;
import java.nio.file.Path;
import java.nio.file.Paths;

@Controller
@RequestMapping("/download")
public class FileDownloadController {

    @GetMapping
    public ResponseEntity<Resource> downloadFile() {
        // 指定要下载的文件路径
        String filePath = "/path/to/your/file.ext";
        Path path = Paths.get(filePath);
        Resource resource;
        String contentType;
        try {
            // 从文件路径创建一个资源对象
            resource = new UrlResource(path.toUri());
            // 根据文件扩展名动态设置 Content-Type
           contentType = determineContentType(resource.getFilename());
        } catch (IOException e) {
            e.printStackTrace();
            return ResponseEntity.notFound().build();
        }

        // 检查资源是否存在并且可读
        if (!resource.exists() || !resource.isReadable()) {
            return ResponseEntity.notFound().build();
        }

        // 尝试下载文件
        try {
           
            return ResponseEntity.ok()
                    .contentType(MediaType.parseMediaType(contentType))// 设置响应内容类型为流数据
                    .header(HttpHeaders.CONTENT_DISPOSITION, "attachment; filename=\"" + resource.getFilename() + "\"") // 设置下载文件的文件名
                    .body(resource); // 返回资源对象
        } catch (Exception e) {
            e.printStackTrace();
            // 如果下载失败,
            //return ResponseEntity.status(HttpStatus.INTERNAL_SERVER_ERROR).body("下载文件失败,请稍后重试。");
        }
    }
	// 根据文件扩展名返回对应的 Content-Type
	private String determineContentType(String filename) {
	    String extension = filename.substring(filename.lastIndexOf(".") + 1).toLowerCase();
	    switch (extension) {
	        case "pdf":
	            return "application/pdf";
	        case "txt":
	            return "text/plain";
	        case "doc":
	        case "docx":
	            return "application/msword";
	        case "xls":
	        case "xlsx":
	            return "application/vnd.ms-excel";
	        // 其他文件类型...
	        default:
	            return "application/octet-stream"; // 默认为二进制数据流
	    }
	}
}
相关推荐
Swift社区4 分钟前
如何解决 Spring Bean 循环依赖
java·后端·spring
我真的是大笨蛋7 分钟前
从源码和设计模式深挖AQS(AbstractQueuedSynchronizer)
java·jvm·设计模式
知识分享小能手7 分钟前
React学习教程,从入门到精通,React 组件生命周期详解(适用于 React 16.3+,推荐函数组件 + Hooks)(17)
前端·javascript·vue.js·学习·react.js·前端框架·vue3
面向星辰17 分钟前
html音视频和超链接标签,颜色标签
前端·html·音视频
lxh011319 分钟前
LRU 缓存
开发语言·前端·javascript
空山新雨(大队长)1 小时前
Java第五课:输入输出
java·开发语言
白云如幻1 小时前
【Java】QBC检索和本地SQL检索
java·数据库·sql
yangzhi_emo1 小时前
ES6笔记5
前端·笔记·es6
wow_DG1 小时前
【Vue2 ✨】Vue2 入门之旅 · 进阶篇(二):虚拟 DOM 与 Diff 算法
开发语言·javascript·vue.js·算法·前端框架