2013-08-15 13 views
6

Próbuję kodować plik mp3 w formacie base64. Następnie zagraj w broswer. Działa doskonale na safari i chrome, ale nie na Firefox.Jak odtwarzać dane dźwiękowe base64 na firefoxie przy użyciu HTML5?

Moje pytanie brzmi: "czy istnieje sposób, aby firefox odtwarzał plik audio w formacie base64/binarnym?"

ps: Wiem, że firefox nie może odtwarzać mp3, więc próbowałem innych plików audio, jak wav, ogg ... Żaden z nich nie działa na Firefoxie po tym, jak zakodowałem je na base64. Proszę o pomoc

<body> 
    <div> 
     <form> 
     Select a file: <input type="file" name="img" id="myaudio"/> 
     </form> 
    </div> 
    <div id="click"> 
     <span>click</span> 
    </div> 
    <div id="body"> 
     <audio controls="controls" autobuffer="autobuffer" autoplay="autoplay"> 
     </audio> 

    </div> 
    <script type="text/javascript"> 
     $(document).ready(function(){ 
       $("#click").click(function(){ 
        var audio = $("input[type='file']").get(0).files[0]; 

        readFile(audio, function(e) { 
         var result = e.target.result; *// here I get a binary string of my original audio file* 
         encodedData = btoa(result); *// encode it to base64* 
         $("audio").html("<source src=\"data:audio/mp3;base64,"+encodedData+"\"/>");  *//add the source to audio* 
        }); 
       }); 

     }); 

     function readFile(file, onLoadCallback){ 
      var reader = new FileReader(); 
      reader.onload = onLoadCallback; 
      reader.readAsBinaryString(file); 
     } 


    </script> 
</body> 

Odpowiedz

3

Zamiast readAsBinaryString kodowanie następnie base64.
użyć readAsDataURL, który daje pełne dane uri.

<script type="text/javascript"> 
    $(document).ready(function(){ 
      $("#click").click(function(){ 
       var audio = $("input[type='file']").get(0).files[0]; 

       readFile(audio, function(e) { 
        var result = e.target.result; *// here I get a binary string of my original audio file* 
        //encodedData = btoa(result); *// encode it to base64* 
        $("audio").html("<source src=\""+result+"\"/>");  *//add the source to audio* 
       }); 
      }); 

    }); 

    function readFile(file, onLoadCallback){ 
     var reader = new FileReader(); 
     reader.onload = onLoadCallback; 
     reader.readAsDataURL(file); 
    } 


</script> 

http://jsfiddle.net/Z9pJ7/2/

+0

ja nie powinienem tego robić. Podany powyżej kod to po prostu kod testowy. To, co chcę zrobić, to uzyskać dane audio z bazy danych, która jest już w formacie base64, kiedy ją otrzymam, a następnie odtwarzać w przeglądarce (Firefox). ale thx :) – Dominic

+0

Po prostu przetestowałem twoją sugestię, nadal działa dla Chrome, ale nie Firefox :( – Dominic

+0

@Dominic zobacz aktualizację Zapomniałem usunąć btoa, przetestowałem to na pliku OGG i zadziałało – Musa

Powiązane problemy