Question

我正在尝试上传一些通过Web表单获取的数据：

   <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预签名网址，则无法在同一请求中上传两个文件。

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

1 个答案: