在 Vue 中处理字节数组答案

【问题标题】：Handle Byte Array in Vue在 Vue 中处理字节数组
【发布时间】：2021-04-13 05:13:45
【问题描述】：

我是 Vue 的新手，现在尝试将字节数组作为 .xls 文件处理

现在我有一个文件看起来像的问题 broken

如果我将它保存为服务器端的文件，数据看起来很好，没有任何问题

服务器端：

    Workbook wb = new HSSFWorkbook();
    Sheet sheet = wb.createSheet("Payments");
    for (int i = 0; i < payments.size(); i++) {
        Payment payment = payments.get(i);
        Row row = sheet.createRow(i);

        ...(adding a lot of data)
    }

    try (ByteArrayOutputStream bos = new ByteArrayOutputStream()) {
        wb.write(bos);
        wb.close();
        return bos.toByteArray();
    }

Vue方面：

axios.post(myRequestAndData)
    .then(resp => {
                var fileURL = window.URL.createObjectURL(new Blob([resp.data]));
                var fileLink = document.createElement('a');
                fileLink.href = fileURL;
                fileLink.setAttribute('download', 'file.xls');
                document.body.appendChild(fileLink);
                fileLink.click();

那么我怎样才能以正确的方式处理我的 ByteArray 数据来创建文件呢？还是谢谢

【问题讨论】：

resp.data的类型是什么？
@JoshuaAngnoe responseType:"blob"。在stackoverflow.com/questions/61461094/…看到它
你试过var fileURL = window.URL.createObjectURL(new Blob(resp.data));而不是new Blob([resp.data])
@JoshuaAngnoe 不，但是在这样做并回滚之后，只有' responseType:"blob" '它开始正常工作。我知道为什么，但还是谢谢你：D

标签： java arrays file vue.js xls

【解决方案1】：

通过在axios.post/get 选项中添加,{responseType:"blob"} 解决

感谢@JoshuaAngnoe 的帮助！

【讨论】：