springmvc导出excel js怎么写

在Spring MVC中导出Excel文件，通常涉及到服务器端生成Excel文件，然后通过HTTP响应将其发送到客户端。客户端使用JavaScript来处理和下载这个文件。核心步骤包括：使用Apache POI生成Excel文件、设置HTTP响应头、使用JavaScript发送请求和处理响应。以下是详细的步骤和代码示例。

一、Spring MVC生成Excel文件

1、引入必要的依赖

首先，确保你在项目中引入了Apache POI库，这是一个处理Excel文件的强大工具。

<dependency>
    <groupId>org.apache.poi</groupId>
    <artifactId>poi-ooxml</artifactId>
    <version>4.1.2</version>
</dependency>

2、创建Excel文件生成方法

在控制器中创建一个方法来生成Excel文件并将其作为响应发送给客户端。

import org.apache.poi.ss.usermodel.*;
import org.apache.poi.xssf.usermodel.XSSFWorkbook;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
@Controller
public class ExcelController {
    @GetMapping("/export/excel")
    public void exportToExcel(HttpServletResponse response) throws IOException {
        Workbook workbook = new XSSFWorkbook();
        Sheet sheet = workbook.createSheet("Data");
        // Create a row and put some cells in it. Rows are 0-based.
        Row row = sheet.createRow(0);
        Cell cell = row.createCell(0);
        cell.setCellValue("Hello, World!");
        // Set the content type and attachment header.
        response.setContentType("application/vnd.openxmlformats-officedocument.spreadsheetml.sheet");
        response.setHeader("Content-Disposition", "attachment; filename=data.xlsx");
        // Write the workbook to the response output stream.
        workbook.write(response.getOutputStream());
        workbook.close();
    }
}

二、客户端使用JavaScript发送请求

在客户端，你可以使用JavaScript来发送请求并处理下载的文件。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Export Excel</title>
</head>
<body>
    <button id="downloadBtn">Download Excel</button>
    <script>
        document.getElementById('downloadBtn').addEventListener('click', function() {
            fetch('/export/excel')
                .then(response => {
                    if (response.ok) {
                        return response.blob();
                    }
                    throw new Error('Network response was not ok.');
                })
                .then(blob => {
                    const url = window.URL.createObjectURL(blob);
                    const a = document.createElement('a');
                    a.href = url;
                    a.download = 'data.xlsx';
                    document.body.appendChild(a);
                    a.click();
                    a.remove();
                })
                .catch(error => {
                    console.error('There was a problem with the fetch operation:', error);
                });
        });
    </script>
</body>
</html>

三、详细分析与扩展

1、生成复杂的Excel文件

在实际应用中，Excel文件可能包含多个工作表、复杂的格式以及大量的数据。你可以使用Apache POI的丰富功能来创建这些复杂的结构。

import org.apache.poi.ss.usermodel.*;
import org.apache.poi.xssf.usermodel.XSSFWorkbook;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.util.List;
public class ExcelService {
    public void generateExcel(HttpServletResponse response, List<MyData> dataList) throws IOException {
        Workbook workbook = new XSSFWorkbook();
        Sheet sheet = workbook.createSheet("Data");
        // Create header row
        Row headerRow = sheet.createRow(0);
        headerRow.createCell(0).setCellValue("Column 1");
        headerRow.createCell(1).setCellValue("Column 2");
        // Fill data rows
        int rowNum = 1;
        for (MyData data : dataList) {
            Row row = sheet.createRow(rowNum++);
            row.createCell(0).setCellValue(data.getColumn1());
            row.createCell(1).setCellValue(data.getColumn2());
        }
        // Set the content type and attachment header.
        response.setContentType("application/vnd.openxmlformats-officedocument.spreadsheetml.sheet");
        response.setHeader("Content-Disposition", "attachment; filename=data.xlsx");
        // Write the workbook to the response output stream.
        workbook.write(response.getOutputStream());
        workbook.close();
    }
}

2、处理大数据量

在处理大数据量时，可能会遇到性能问题。Apache POI提供了SXSSFWorkbook类来处理大数据量的情况。

import org.apache.poi.xssf.streaming.SXSSFWorkbook;
// Use SXSSFWorkbook for large data sets
SXSSFWorkbook workbook = new SXSSFWorkbook();

3、JavaScript处理进度提示

在客户端，可以使用JavaScript和一些UI库来显示文件下载的进度提示。

document.getElementById('downloadBtn').addEventListener('click', function() {
    const xhr = new XMLHttpRequest();
    xhr.open('GET', '/export/excel', true);
    xhr.responseType = 'blob';
    xhr.onprogress = function(event) {
        if (event.lengthComputable) {
            const percentComplete = (event.loaded / event.total) * 100;
            console.log(`Download is ${percentComplete}% complete.`);
        }
    };
    xhr.onload = function() {
        if (xhr.status === 200) {
            const url = window.URL.createObjectURL(xhr.response);
            const a = document.createElement('a');
            a.href = url;
            a.download = 'data.xlsx';
            document.body.appendChild(a);
            a.click();
            a.remove();
        }
    };
    xhr.onerror = function() {
        console.error('There was a problem with the request.');
    };
    xhr.send();
});

四、总结

通过上述步骤，我们可以在Spring MVC中生成Excel文件，并通过JavaScript在客户端处理文件下载。这种方法可以用于各种场景，包括导出报表、数据备份等。关键步骤包括生成Excel文件、设置HTTP响应头、使用JavaScript发送请求和处理响应。此外，可以根据实际需求，优化生成Excel文件的性能和复杂度。