gpt4 book ai didi

javascript - 如何使用 HTML5 在 firefox 上播放 base64 音频数据?

转载 作者:太空狗 更新时间:2023-10-29 14:18:08 26 4
gpt4 key购买 nike

我正在尝试以 base64 格式对 mp3 文件进行编码。然后通过浏览器播放。它在 safari 和 chrome 上完美运行,但在 Firefox 上运行不佳。

我的问题是“有没有办法让 firefox 播放 base64/二进制字符串格式的音频文件?”

ps:我知道 firefox 不能播放 mp3,所以我尝试了其他音频文件,如 wav、ogg...在我将它们编码为 base64 后,它们都无法在 Firefox 上运行。请帮忙

<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>

最佳答案

而不是使用 readAsBinaryString 然后使用 base64 编码。
使用 readAsDataURL 为您提供完整的数据 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/

关于javascript - 如何使用 HTML5 在 firefox 上播放 base64 音频数据?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18244692/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com