javascript - 传递 createObjectURL

Question

我想将 window.URL.createObjectURL(file) 创建的地址传递给 dancer.js 但我得到 GET blob:http%3A//localhost/b847c5cd-aaa7- 4ce0-8ff8-c13c6fc3505a.mp3 404(未找到)。

我设法使用通过文件输入选择的文件创建音频元素，但 dancer.js 根本找不到该文件……有什么想法吗？ (下面是我如何传递 ObjectURL)

    $(document).ready(function(){
    $("#submit").click(function(){
        var file = document.getElementById("file").files[0];
        $('body').append('<audio id="audio" controls="controls"></audio>');
        $('#audio').append('<source src='+window.URL.createObjectURL(file)+' type=audio/mpeg />')
        $('body').append('<a href='+window.URL.createObjectURL(file)+'>link</a>')
        dancer(window.URL.createObjectURL(file));
    })
})

Answer 1

查看 dancer.js readme它看起来像 load方法将采用对 <audio> 的引用指定源的元素或配置对象:{scr: varHoldingFileURL} .由于您已经在创建 <audio>你文件的元素我会把它传递给舞者:

$(document).ready(function() {
    var dancer = new Dancer(),
        fileURL;

    $("#submit").click(function(){
            var audioElement,
                file = document.getElementById("file").files[0];

            fileURL = window.URL.createObjectURL(file);

            // remove any preexisting instances of the audio tag
            $('#audio').remove();

            // Revoke any previously used file URL so it doesn't
            // take up memory anymore.
            window.URL.revokeObjectURL(fileURL);

            $('body').append('<audio id="audio" controls="controls"></audio>');
            $('#audio').append('<source src='+ fileURL +' type=audio/mpeg />')
            $('body').append('<a href=' + fileURL +'>link</a>')

            // get a reference to the audio element we created
            audioElement = $('#audio')[0];

            dancer.load(audioElement);
    })
});