javascript - 如何将数据发送到我的服务器并让它以文件形式返回

Question

我无法(据我所知)在我的(javascript浏览器)客户端中创建文件，所以我希望我的服务器在将其发送回客户端之前执行此操作，而客户端又应该打开一个对话框，询问用户在哪里保存文件。

我该如何实现这一目标？下面是我目前拥有的要点。

客户端

$.ajax({
        type: 'POST',
        dataType: 'json',
        url: "http://localhost:5000/api/file",
        data: postData,
        contentType : 'application/json',
        success: function (responseData, textStatus, jqXHR) {
            // What do I put here?
        },
        error: function (jqXHR, textStatus, errorThrown) {
            alert(errorThrown);
        }
    });

服务器

router.post('/file', function (request, response) {
        var content = '';
        request.on('data', function (data) {
            content += data;
        });

        request.on('end', function () {
            var contentAsJson = JSON.parse(content);
            response.set("Content-Type", "text/plain");
            response.set("Content-Length", contentAsJson.text.length);
            response.set("Content-Disposition", 'attachment; filename='filename.txt');
            response.send(contentAsJson.text);
        });
    });

Answer 1

其实你可以只用JS在客户端生成文件的二进制流，而不必将数据发布到服务器。

首先，创建数据的二进制表示形式:

var str = <<your data as string>>
var uint = new Uint8Array(str.length);
for (var i = 0, j = str.length; i < j; ++i) {
    uint[i] = str.charCodeAt(i);
}

然后，请求将其保存为文件:

var sampleBytes = <<your typed array with the data>>;

var saveByteArray = (function () {
    var a = document.createElement("a");
    document.body.appendChild(a);
    a.style = "display: none";
    return function (data, name) {
        var blob = new Blob(data, {type: "octet/stream"}),
            url = window.URL.createObjectURL(blob);
        a.href = url;
        a.download = name;
        a.click();
        window.URL.revokeObjectURL(url);
    };
}());

saveByteArray([sampleBytes], 'example.txt');