如何在不使用 html 表单的情况下通过 $.ajax() POST 发送 zip 文件？

Question

我已经使用 JSZIP 库文件以这种方式为 2 个 xml 文件创建了一个 zip 文件，即

jszip.js

jszip-load.js

jszip-inflate.js

jszip-deflate.js

var zip = new JSZip();
zip.file("hi.xml", "<?xml version="1.0"?><root/></root></xml>");
zip.file("hello.xml", "<?xml version="1.0"?><pest/></pest></xml>");
//var content = zip.generate({ compression: "DEFLATE" });
var content=zip.generate({base64: true, binary: true, compression: "DEFLATE" });

这个压缩部分是成功的，因为我可以在我的下载文件夹中获得 downloads.zip 和上面的 2 个文件 hi.xml & hello.xml，如果我添加这段代码，

location.href="data:application/zip;base64,"+content;

但是我在不使用 html 表单的情况下通过 ajax 将此 zip 文件上传到服务器时遇到了困难。这就是我在代码中所做的，

var oBlob = new (window.BlobBuilder || window.WebKitBlobBuilder ||
                 window.MozBlobBuilder || window.MSBlobBuilder)();

        var raw = atob(content);    //decode the base64 string
        var rawLength = raw.length;
        var uInt8Array = new Uint8Array(rawLength);
        for (var i = 0; i < rawLength; ++i) { //convert to uInt8Array
            uInt8Array[i] = raw.charCodeAt(i);
        }

        oBlob.append(uInt8Array.buffer); //append it to blobbuilder
        oMyForm.append(content, oBlob.getBlob("application/zip")); //because you create a zip file, so get the zip type

        //send it
        $.ajax({
        type: 'POST',
        url: 'requestURL',//java spring servlet URL
        async: false,
        data: { 
            name:'user',
        files:oMyForm
        },
        success: function(msg){
        },
        error : function(jqXHR, textStatus, errorThrown) {
            if(typeof jqXHR == 'object'){
                if(typeof jqXHR.responseText != 'undefined'){
                    if(jqXHR.responseText == 'success'){                        

                    }
                }
            }
        }

    });

有人可以帮我解决这个问题吗？

我也这样做过，

var oBlob = new (window.BlobBuilder || window.WebKitBlobBuilder ||
                 window.MozBlobBuilder || window.MSBlobBuilder)();

    var raw = atob(content);    //decode the base64 string
    var rawLength = raw.length;
    var uInt8Array = new Uint8Array(rawLength);
    for (var i = 0; i < rawLength; ++i) { //convert to uInt8Array
        uInt8Array[i] = raw.charCodeAt(i);
    }

    oBlob.append(uInt8Array.buffer); //append it to blobbuilder
    oMyForm.append(content, oBlob.getBlob("application/zip")); //because you create a zip file, so get the zip type

    //send it
    var oReq = new XMLHttpRequest();
    oReq.open("POST", 'requestURL');
    oReq.send(oMyForm);

我在这里缺少什么？为什么 zip 文件没有发布到服务器？

有人能帮帮我吗？

Answer 1

首先，请确保使用最新的 JSZip 版本（例如，jszip-inflate.js 不再存在）。

灵感来自 How can javascript upload a blob? :

var zip = new JSZip();
zip.file("hello.xml", "...");
var content = zip.generate({
    type: "blob",
    compression: "DEFLATE"
});

var fd = new FormData();
fd.append('name', 'user');
fd.append('zip', content);

$.ajax({
    type: 'POST',
    url: 'requestURL',
    data: fd,
    processData: false,
    contentType: false
}).done(function(data) {
    console.log(data);
});

如何在不使用 html 表单的情况下通过 $.ajax() POST 发送 zip 文件？

How do I send zip file(s) via $.ajax() POST without using html form?

ajax

jquery

post

spring-mvc

jszip