用javascript编写用base64编码的.wav声音文件

Udo*_*Udo 19 javascript html5 base64

能通过以下方式用javascript播放声音,

    var snd = new Audio('sound.wav');
    snd.play();
Run Code Online (Sandbox Code Playgroud)

这会播放所需的声音,但有时它会加载缓慢或甚至根本无法加载,所以我将声音编码在base 64中并尝试以这种方式播放.

      var splash = {
prefix: "data:audio/wav;base64,",
sound: [ "*base64 string here*" ] };

    var snd = new Audio(splash); 
    snd.play();
Run Code Online (Sandbox Code Playgroud)

但声音没有播放,有没有办法解决呢?

Pau*_* S. 42

这看起来不像是为HTMLAudioElement/使用Audio构造函数的正确方法.<audio>

轻微调整

var snd = new Audio("data:audio/wav;base64," + base64string);
snd.play();
Run Code Online (Sandbox Code Playgroud)

如果它在控制台中工作但不在脚本中工作,则可能会收集垃圾,在这种情况下它会保留范围

var Sound = (function () {
    var df = document.createDocumentFragment();
    return function Sound(src) {
        var snd = new Audio(src);
        df.appendChild(snd); // keep in fragment until finished playing
        snd.addEventListener('ended', function () {df.removeChild(snd);});
        snd.play();
        return snd;
    }
}());
// then do it
var snd = Sound("data:audio/wav;base64," + base64string);
Run Code Online (Sandbox Code Playgroud)

  • @UDcreate它取决于你的意思"加载更快"._**base64**_表示页面加载时间较长,具体取决于服务器的_ping_和声音文件大小**可能比页面+文件**更长****初始加载**因为base64占用更多空间,但一旦页面加载,声音将立即可用.或者,如果您使用_**文件**_,**页面加载速度要快得多**,但是当您想要播放声音时,**可能会延迟**. (3认同)
  • @Vasanth 在 2018 年,Chrome 似乎不支持以这种方式播放 WAV。如果您 snd.play().catch(err=&gt;console.log(err)) 您将看到:“NotSupportedError:该元素没有支持的来源。” 我的解决方案是使用 mp3 而不是 wavs。 (2认同)

小智 6

var snd = new Audio("data:audio/x-wav;base64, <URI data>");
snd.play();
Run Code Online (Sandbox Code Playgroud)

无需将splash声明为对象变量.

Base64转换可以从以下网址轻松完成:https: //dopiaza.org/tools/datauri/index.php