前端Ajax请求与后端Java实现下载ZIP压缩包功能示例

在现代Web开发中，实现文件的下载是一个常见需求，尤其是当用户需要从服务器下载多个文件作为压缩包时。本篇文章将详细介绍如何使用前端Ajax请求配合后端Java（使用Spring Boot框架）来实现一个下载ZIP压缩包的功能。这将涵盖从前端到后端的完整流程，确保开发者能够快速理解和实现这一功能。

前端实现（使用JavaScript和Ajax）

在前端，我们将使用JavaScript的XMLHttpRequest对象或fetch API来发送一个Ajax请求到后端服务器，请求一个包含多个文件的ZIP压缩包。

1. 创建Ajax请求

javascript function downloadZip() { const xhr = new XMLHttpRequest(); xhr.open("GET", "/download/zip", true); // 修改为你的下载接口URL xhr.responseType = "blob"; // 重要：设置响应类型为blob xhr.onload = function() { if (this.status === 200) { // 请求成功 const url = window.URL.createObjectURL(this.response); // 创建URL对象 const a = document.createElement('a'); // 创建a标签用于下载 a.style.display = 'none'; // 隐藏a标签 a.href = url; // 设置a标签的href属性为上面创建的URL对象 a.download = 'files.zip'; // 设置下载的文件名 document.body.appendChild(a); // 将a标签添加到body中 a.click(); // 触发点击事件进行下载 window.URL.revokeObjectURL(url); // 释放URL对象 } else { console.error("Error during download: ", this.statusText); } }; xhr.send(); // 发送请求 }
这段代码创建了一个Ajax请求，当响应成功时，它将创建一个指向响应内容的URL，并模拟点击一个不可见的链接来触发下载。注意，这里使用了responseType为blob来确保能够处理二进制数据。

后端实现（使用Spring Boot）

在Spring Boot中，我们将使用ResourceUtils来访问文件系统中的文件，并使用ZipOutputStream来创建ZIP文件。

1. 添加依赖项（pom.xml）

首先确保你的Spring Boot项目中包含了以下依赖：
xml <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-web</artifactId> </dependency> <dependency> <groupId>org.springframework</groupId> <artifactId>spring-context-support</artifactId> </dependency> <!-- 用于ResourceUtils -->

2. 创建Controller类

```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.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RestController;
import java.io.*;
import java.util.zip.*;
import java.nio.file.*;
import java.util.*;
import javax.servlet.http.*;
import org.springframework.web.servlet.*;
import org.springframework.web.servlet.mvc.*;
import org.springframework.core.*;
import org.springframework.*;
import org.springframework.web.*;
import org.springframework.*;
import org.springframework.*;
import org.*;
import java.*;
import java.*;
import java.*; 🚀 # 用注解标记重要代码块，用于高亮和强调。该示例展示了如何利用ZipOutputStream和FileInputStream生成ZIP文件并返回给客户端。