绑定精细的上传器实例以提交表单

Question

我被困在一些可能非常简单的事情上，但我是一名后端开发人员，我不能真正融入 javascript ;)

我有一个带有文件输入的表单：

<form id='my-form'>
    ...
    <input type='file' id='file-input' name='file-input'>
    ...
    <button type='submit'>
</form>

我希望将此文件发送到 S3 并提交。我决定使用 Fine Uploader S3。由于我现有 UI，我认为核心模式适合我。所以，根据 fine-uploader 文档，我需要这样的东西：

var uploader = new qq.s3.FineUploaderBasic({
    request: {
        endpoint: "my_s3_bucket",
        accessKey: "MY_PUBLIC_ACCESS_KEY"
    },
    signature: {
        endpoint: "/s3/sign/"
    },
    chunking: {
        enabled: true
    },
    resume: {
        enabled: true
    }
});

问题是：如何将所有东西绑定在一起？ IE。如何制作精细上传器运行并在表单提交时将文件上传到 S3？

Answer 1

哦，我找到了答案 - 我需要在 fine-uploader docs 中再深入一点。只需在 fine uploader 对象中指定一个表单字段：

var uploader = new qq.s3.FineUploaderBasic({
    form: {
        element: "my-form",
    },
    ...
});

另一个选项是简单的手动绑定：

$("#my-form").submit(function() {
    var file = $("#file-input").prop('files')[0];

    uploader.addFiles(file);
    uploader.uploadStoredFiles();

    // actually submit the form (return false to not)
    return true;
});

绑定精细的上传器实例以提交表单

Bind fine uploader instance to form submit

javascript

amazon-s3

fine-uploader