如何通过 lambda 和 api 网关将我的 blob 上传到我的 s3 存储桶？

Question

我正在尝试上传通过网络表单获得的一些数据：

   <form class="container" enctype="multipart/form-data" method="POST" name="formS3ObjManager" id="formS3ObjManagerId">

    <div class="form-row">
            <div class="col">
                <input type="text" class="form-control" id="age" placeholder="Confirm your age" required>
            </div>
        </div>
        <div class="form-row">
            <div class="col">
                <input type="text" class="form-control" id="firstname" placeholder="Confirm your first name" required>
            </div>
        </div>

        <input type="file" name="file" id="file1" required />
        <input type="file" name="file2" id="file2" required />
    </form>

我这样做的方式是通过 AWS lamda 和 apigateway。

我可以轻松上传我的输入文件，接下来我需要在这个 Web 应用程序中构建的功能是将表单数据作为文本文件上传到 s3 存储桶中与随附文件一起放置。

在谷歌搜索后，我想出了以下方法来完成此操作：

        function uploadFile(s3Data, url) {

        var formData = new FormData();
    /*
    All the PreSigned URL fields to FormData as required by Amazon S3
    */
    for (key in s3Data.fields) {
        formData.append(key, s3Data.fields[key]);
    };
    /*
    Attach the file to be uploaded to FormData
    */
    formData.append('file', $('input[type="file"]')[0].files[0]);
    /**/
    const firstname = document.getElementById('firstname').value;
    const age = document.getElementById('age').value;
    lines = 'firstname:'+firstname +'      '+'age:'+ age

    let blob2 = new Blob([lines], { type: "text/plain"  });
            $.ajax({
        url: url,
        type: 'POST',
        data: formData,
        cache: false,
        contentType: false,
        processData: false,
        xhr: function() {
            var xhr = new window.XMLHttpRequest();
            xhr.upload.addEventListener("progress", function(evt) {
                if (evt.lengthComputable) {
                    var percentComplete = evt.loaded / evt.total;
                    console.log(percentComplete);
                    $('#status').html('<b> Uploading -> ' + (Math.round(percentComplete * 100)) + '% - do not close the browser window</b>');
                }
            }, false);
            return xhr;
        },
        success: function(data, textStatus, request) {
            if (request.status === 200 || request.status === 204) {
                $("#urlTextId").html("Status: Uploaded Successfully.<br /> Object Key: " + s3Data.fields.key);
                $("#SignedUrlId").html("");
                console.log("Status:" + request.status);
                $("#div-obj-holderId").show();
            } else {
                $("#urlTextId").html("Br!! Unable to upload Object. Try again!! <br />Status:" + request.status);
            }
        },
    });

我不知道如何将 blob（此处命名为 blob2）转换为文本文件，即 example.txt，其中包含表单数据（年龄和名字）。我也不知道如何通过 ajax 发布请求上传。

我可以得到一些建议/解决方案吗？

Answer 1

您可以将 blob 添加到 FormData，如下所示。

let blob2 = new Blob([lines], { type: "text/plain"  });
formData.append("blob",blob2, 'example.txt');

如果您使用 s3 预签名 url，则无法在同一请求中上传两个文件。