5个库和API，用于操纵HTML5音频

>这篇文章探讨了几个利用HTML5音频API和HTML5音频元素的JavaScript库，并提供了各种在网络游戏和应用程序中进行声音操作的方法。 图书馆展示了各种特征和复杂性，满足了不同的项目需求。

关键要点：

• webaudiox.js： Web Audio API的轻量级助手集，具有零依赖性。 HTML5游戏的理想选择，但缺乏较旧的浏览器支持，没有其他脚本。
> howler.js：
• 一个可靠的JavaScript音频库，使用HTML5音频后备默认为Web Audio API。 支持多种格式，同时播放并提供广泛的功能，使其适合游戏和以音频为中心的Web应用程序。> >
pedalboard.js：
• 使用Web Audio API专门创建音频效果，尤其是吉他效果。它的面向对象的设计很干净，但对于一般游戏开发而言可能不太通用。>
fifer：
• > html5音频API的最小库，较旧的浏览器带有闪光回声。它的简单性使其成为大型项目的良好基础，支持IE9（HTML5）和IE8（flash）。 > wad： Web音频DAW（数字音频工作站）库简化了Web Audio API操纵。提供Panning，3D Panning，过滤器和混响等功能，但目前缺乏Firefox支持。
• > webaudiox.js

1. > webaudiox.js为Web音频API提供辅助功能，不需要外部库。 它的浏览器兼容性仅限于支持Web音频API的浏览器。 下面的示例演示了其基本用法：

助手实时可视化音频播放。 图书馆的GitHub存储库包含进一步的示例。 请注意，它缺乏较旧浏览器的多填充。

// after including the webaudiox library
var context = new AudioContext()

// Create lineOut
var lineOut = new WebAudiox.LineOut(context)

// load a sound and play it immediately
WebAudiox.loadBuffer(context, 'sound.wav', function(buffer){
    // init AudioBufferSourceNode
    var source  = context.createBufferSource();
    source.buffer = buffer
    source.connect(lineOut.destination)

    // start the sound now
    source.start(0);
});

analyser2canvas

howler.js

2. howler.js是一个多功能的JavaScript音频库，优先考虑Web音频API，但倒退到HTML5 Audio。

>关键功能包括：

多格式支持

缓存

>多轨播放

• >全球/轨道特定音量和静音控件
• 方法链接
• >轻量级（3KB GZPICPECT）
>其干净的API和全面的功能使其适合游戏以外的各种Web应用程序。 下面的“声音精灵”示例说明了其简洁的语法：

• // after including the webaudiox library
  var context = new AudioContext()
  
  // Create lineOut
  var lineOut = new WebAudiox.LineOut(context)
  
  // load a sound and play it immediately
  WebAudiox.loadBuffer(context, 'sound.wav', function(buffer){
      // init AudioBufferSourceNode
      var source  = context.createBufferSource();
      source.buffer = buffer
      source.connect(lineOut.destination)
  
      // start the sound now
      source.start(0);
  });

  3. > pedalboard.js

  > pedalboard.js专注于创建音频效果，尤其是使用Web Audio API来创建吉他。 其面向对象的结构简化了效应链的创建。 踏板.io示例其功能。

  

  >示例：

  var sound = new Howl({
    urls: ['sounds.mp3', 'sounds.ogg'],
    sprite: {
      blast: [0, 1000],
      laser: [2000, 3000],
      winner: [4000, 7500]
    }
  });
  
  // shoot the laser!
  sound.play('laser');

  虽然可以超越其核心功能，但可以使用专门的创意应用程序。

  >

  4. >

  wad（Web Audio DAW）简化了Web音频API操纵。 以下示例演示了其合成钢琴声音的语法：>

  // initialize the stage and get the context
  var stage = new pb.Stage();
  var ctx = stage.getContext();
  
  // initialize the board and pedals
  var board = new pb.Board(ctx);
  var od = new pb.stomp.Overdrive(ctx);
  var reverb = new pb.stomp.Reverb(ctx);
  var vol = new pb.stomp.Volume(ctx);
  
  // add pedals to board
  board.addPedals([od, reverb]);
  board.addPedalsAt(1, vol);
  
  // tweak pedal settings
  od.setDrive(0.7);
  od.setLevel(0.7);
  reverb.setLevel(0.3);
  vol.setLevel(0.2);
  
  // set the board on stage and start playing!
  stage.setBoard(board);

  >功能包括平移，3D平板，过滤器，混响和麦克风输入。 但是，它目前缺乏firefox的支持。

  fifer

  5. FIFER是带有Flash后备的HTML5音频API的小库。 它的直接API适合构建。

     >示例：

  它的主要优势是通过Flash后备。> Web音频API资源和浏览器支持：

  上面的库摘要摘要Web音频API，但是直接API学习的资源包括Boris Smus的“ Web Audio API”书籍（O'Reilly），HTML5 Rocks的Web Audio简介和MDN的文档。 浏览器对Web Audio API的支持不是通用的，缺乏某些移动浏览器和Safari（需要供应商前缀），并且在IE中完全不存在。

  var piano = new Wad({
      source : 'square', 
      env : {
          attack : .01, 
          decay : .005, 
          sustain : .2, 
          hold : .015, 
          release : .3
      }, 
      filter : {
          type : 'lowpass', 
          frequency : 1200, 
          q : 8.5, 
          env : {
              attack : .2, 
              frequency : 600
          }
      }
  })
  
  piano.play({ pitch : 'C5' })
  piano.play({ pitch : 'Eb5', filter : { q : 15 } })
  piano.play({ pitch : 'F5', env : { release : .2 } })

  >

  常见问题（常见问题解答）：（省略了此部分，因为它包含与重写/释义任务无关的信息，并增加了长度。如果需要，可以重新添加。）

  ）

以上是5个库和API，用于操纵HTML5音频的详细内容。更多信息请关注PHP中文网其他相关文章！