如何在Javascript中保存zip文件的二进制数据？

我从AJAX respose得到以下回复：

这是zip文件的响应。 请告诉我如何在Javascript中保存此filename.zip。在ZIP中有PDF文件

我的代码如下：

$.ajax({

    url: baseURLDownload + "/service/report-builder/generateReportContentPDF",
    beforeSend: function (xhr) {
        xhr.setRequestHeader("Access-Control-Allow-Origin", "*");
        xhr.responseType = 'arraybuffer'
    },
    type: "POST",
    data: JSON.stringify(parameter),
    contentType: "application/json",
    success: function(result) {
        console.log("ssss->"+result);
        var base64String = utf8_to_b64(result);
        //window.open("data:application/zip;base64,"+base64String); // It will download pdf in zip
        var zip = new JSZip();
        zip.add("PDFReport.pdf", result);
        content = zip.generate();
        location.href="data:application/zip;base64," + content;
        $.mobile.loading('hide');

    },
    error: function(xhr){
        console.log("Request Status: " + xhr.status + " Status Text: " + xhr.statusText + " " + xhr.responseText);
        $.mobile.loading('hide');
        showAlert("Error occured. Unable to download Report", "Message", "OK");

    }
});

RESPOSE Console.log（“ssss->”+结果）

主键��Q��F���������������/crt_pdf_10204725.pdf��uX\M�8 | p�����݃�;W�@P�ܝBp��݂�;|C�ھ�W������=O���]]�%�N�����#+�鲁普����������Y������̉�J����3)� O��C����F�M�P�&�����类风湿关节炎�@��7吨。��z（%h��x�x0�0Z�-我��%Q�E�M�����我�"�C��-/��J��齔/ļL瞄�0� �� >�o��[

��6.멆�N��s�$�
�#>˘ '��wT�� ���3.�36DK�+�̓�t6��R��sA:���x�N������'U��RLqA+���ݺ�BM��:4ĞP�}���:�}ߣP����?（F）�9-�W0���2.�{x��#2v8N.$V�>X=/�+�c}���ּ�\Y���\*�J\��
���90�T�L� 3p���*Sfj(���PWWz��O�s�9]&����木卫一|�9�;�5.��ʘdW�cl%�%;����U���%[�5.������Q]$��[L>���yXg�9��2+&，国际单项体育联合会�Q�����u如果您想了解zip文件中的内容，可以使用一些库（zip.js）来处理这类事情。如果您只想保存zip文件，您可以将其视为其他任何文件。
最后我得到了我问题的答案：





代码如下：

var xhr = new XMLHttpRequest();
xhr.open("POST", baseURLDownload + "/service/report/QCPReport", true);
xhr.setRequestHeader("Content-type","application/json");
xhr.setRequestHeader("Access-Control-Allow-Origin", "*");
xhr.onreadystatechange = function() {
    if (xhr.readyState == 4 && xhr.status == 200) {
        // alert("Failed to download:" + xhr.status + "---" + xhr.statusText);
        var blob = new Blob([xhr.response], {type: "octet/stream"});
        var fileName = "QCPReport.zip";
        saveAs(blob, fileName);
    }
}
xhr.responseType = "arraybuffer";
xhr.send(JSON.stringify(QCPParameter));

没有依赖性

与IE 10、11、Chrome、FF和Safari兼容：

function str2bytes (str) {
   var bytes = new Uint8Array(str.length);
   for (var i=0; i<str.length; i++) {
      bytes[i] = str.charCodeAt(i);
    }
    return bytes;
}

var xhr = new XMLHttpRequest();
xhr.open("POST", baseURLDownload + "/service/report/QCPReport", true);
xhr.setRequestHeader("Content-type","application/json");
xhr.setRequestHeader("Access-Control-Allow-Origin", "*");
xhr.onreadystatechange = function() {
    if (xhr.readyState == 4 && xhr.status == 200) {
        // alert("Failed to download:" + xhr.status + "---" + xhr.statusText);
        var blob = new Blob([str2bytes(xhr.response)], {type: "application/zip"});
        var fileName = "QCPReport.zip";
        if (navigator.msSaveOrOpenBlob) {
            navigator.msSaveOrOpenBlob(blob, filename);
        } else {
            var a = document.createElement("a");
            document.body.appendChild(a);
            a.style = "display:none";
            var url = window.URL.createObjectURL(blob);
            a.href = url;
            a.download = filename;
            a.click();
            window.URL.revokeObjectURL(url);
            a.remove();
        }
    }
}
xhr.responseType = "arraybuffer";
xhr.send(JSON.stringify(QCPParameter));

函数str2bytes（str）{
var bytes=新的Uint8Array（str.length）；
对于（var i=0；i对于那些使用fetch的人，您可以这样做

fetch(url, config).
  .then((response) => {
    return response.arrayBuffer()
  })
  .then((data) => handleData(data))

在handleData中，您将实例化Blob对象以处理zip数据。
Axios实现：

const url = 'https://www.example.com/download-zip'

// Payload, eg list of docs to zip
const payload = { documents: ['id1', 'id2', 'id3'] }

// Axios options
const axiosOptions = {
  responseType: 'arraybuffer',
  headers: {
    'Content-Type': 'application/json'
  }
}

// Fetch data and save file
axios
  .post(url, payload, axiosOptions)
  .then((response) => {
    const blob = new Blob([response.data], {
      type: 'application/octet-stream'
    })
    const filename = 'download.zip'
    saveAs(blob, filename)
  })
  .catch((e) => {
    // Handle error
  })
})


这是我的答案
您可以避免使用blob和Filesaver

这是我如何使用GET方法为我的一个项目编写的

var xmlHttp = new XMLHttpRequest();
xmlHttp.open("GET", url, true);
xmlHttp.setRequestHeader("Content-type","application/json");
xmlHttp.setRequestHeader("Access-Control-Allow-Origin", "*");
xmlHttp.responseType= 'blob';

xmlHttp.onreadystatechange = function() {
    if (xmlHttp.readyState == 4 && xmlHttp.status == 200) {
        const downloadUrl = window.URL.createObjectURL(xmlHttp.response);
        const link = document.createElement('a');
        link.setAttribute('href', downloadUrl);
        link.setAttribute('download', `filename.zip`);
        link.style.display = 'none';
        document.body.appendChild(link);
        link.click();
        window.URL.revokeObjectURL(link.href);
        document.body.removeChild(link);
    }
}
xmlHttp.responseType = "arraybuffer";
xmlHttp.send();

问题是什么？请帮助我编写代码，如何将此二进制数据保存为文件。我得到的响应。解决方案：你能帮我编写代码吗？我已经厌倦了所有的工作。我尝试了所有这些…这里没有运气。根本没有解决方案。谢谢。
xhr.responseType=“arraybuffer”“；
是我所缺少的。这里也一样。不过，至少在我的情况下（代码稍有不同），我需要将类型设置为“application/zip”。非常感谢您的帮助。类似的问题感谢它是一个救命稻草，在尝试了这么多事情之后，只有这一个起作用。为什么不设置
xhr.responseType=“blob”
并且只使用
xhr.response
？