Question

我一直在开发Flask / Vue网络应用，但遇到了有关文件下载的问题。我正在使用flask从后端提供一个userupload，它通过send_from_directory（）返回一个文件。这是通过Vue中的downloadFile方法调用的

downloadFile(key, name){

            const path = '/api/ticket/filedownload'
            this.$ajax.post(path, {address: key}, {responseType: 'arraybuffer',})
            .then((response) => {
                // Create response donwload link
                const url = window.URL.createObjectURL(new Blob([response.data], response.headers['contentType']));
                const link = document.createElement('a');
                link.href = url;
                link.setAttribute('download', name);
                document.body.appendChild(link);
                link.click();
            })
            .catch(error => {
                console.log(error)
                window.alert("File not found")
            })
        }

这种方法是我在许多地方在线找到的，似乎对大多数人都有效。但是，在前端提供的文件“包含错误”或似乎已损坏。在我的网络标签中，我可以清楚地看到发布请求成功，并且响应是已发送的实际图像（例如）！当直接在我的网络标签中从帖子结果中复制响应时（Mozilla，鼠标右键>复制>复制响应），我能够检索到该响应是base64编码的，并且可以轻松地解码为上载的同一图像。 但是！：在打印response.data时，输出是完全不同的，而不是在base64中：

base64 from network tab: R0lGODlhWAJYAvcAABAQEL2cUntSG(etc...)
console.log(response.data):GIF89aX�X���������R{R�)�1)�1�j ���������ޔ��{)��j

我尝试将response.data直接作为blob或通过在filereader中对其进行解析而无济于事。我们的this。$ ajax.post是axios帖子的一种解决方法，可以为它提供returnTypes，例如blob，arraybuffer，text，任何东西，所有这些都具有相同的结果。我的问题是：由于我能够从base64（而不是未知格式）转换，我将如何继续访问响应（如在网络选项卡中显示的响应）。或者我将如何以任何成功的方式来解析此响应。

从axios帖子中获取响应数据与原始响应数据不同

0 个答案: