Question

我想知道是否可以使用javascript / jQuery创建音频blob的HTML文件输入。我在线录音，并希望在用户按下表单提交后将录音与其他HTML表单输入一起发布。

编辑：详细说明，我有一个存储在会话缓存中的音频blob。我还有一个HTML表单，其中包含已保存值的文本和文件输入。我想将blob绑定或合并到表单中，以便在提交HTML表单时进行POST。

我可以从现有的HTML表单创建一个formdata，并将blob作为键/值附加，但这似乎“很脏”。我现在正在使用它，但如果有人知道如何将缓存的blob与现有的HTML表单合并/绑定，那将会很棒。

任何帮助都会很棒，谢谢！

Answer 1

你所要做的就是将blob转换为ArrayBuffer并发布，你可以在这里看到如何转换blob：

How to go from Blob to ArrayBuffer

注意：您也可以将其发布为Blob，但是您的服务器需要知道如何处理它。

就发送blob或ArrayBuffer而言，请参阅：

https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/Sending_and_Receiving_Binary_Data

欢呼，希望它有所帮助。

Answer 2

以下是一种上传blob的方法（此外，由于我不会进入但可能与您的情况相关的原因，因此将ajaxForm和iframe设置为true）。

        if (audioRecBlob) {
            var reader = new FileReader();
            reader.onload = function(event){
                $('#audioData').remove();
                var audioData = $('<input type="hidden" id="audioData" name="audioData">');
                audioData.val( event.target.result );
                $('#yourForm').append( audioData );

                realSubmit();
            };
            reader.readAsDataURL(audioRecBlob);
        } else {
            realSubmit();
        }

JS + HTML5：通过HTML表单上传音频blob

2 个答案: