zoukankan      html  css  js  c++  java
  • HTML5 WebAudioAPI简介(一)

    一、常用对象

    1.AudioContext对象

    AudioContext是一个专门用于音频处理的接口,并且原理是讲AudioContext创建出来的各种节点(AudioNode)相互连接,音频数据流经这些节点并作出相应处理。

    创建AudioContent对象

    //普通写法
    var audioContext=new window.AudioContext();
    //为了兼容,也可以这样写
    window.AudioContext = window.AudioContext || window.webkitAudioContext || 
    window.mozAudioContext || window.msAudioContext; //也可以使用错误处理 try { var audioContext = new window.AudioContext(); } catch (e) { Console.log('!Your browser does not support AudioContext'); }

    解码音频文件

    audioContext.decodeAudioData(binary, function(buffer) { ... });

    读取到的音频文件时2进制文件(可以使用Ajax远程加载,可以使用FileAPI读取本地文件),

    我们需要让AudioContext先对其解码,然后再进行后续擦做。

    返回结果的buffer为AudioBuffer类型数据。

    2.AudioBuffer对象

    length:文件大小

    duration:音频长度

    3.创建音频处理节点

    AudioBufferSourceNode对象

    //创建AudioBufferSourceNode对象
    var source = ctx.createBufferSource();

    链接节点:

                        //创建AudioBufferSourceNode对象
                        var source = ctx.createBufferSource();
                        source.buffer = buffer;
                        source.connect(ctx.destination);

    AnalyserNode对象(分析器)

    创建链接点:

    //创建分析器
    var analyser = ctx.createAnalyser();
    source = ctx.createBufferSource();
    //将source与分析器链接
    source.connect(analyser);
    //将分析器与destination链接,这样才能形成到达扬声器的通路
    analyser.connect(ctx.destination);
    //将解码后的buffer数据复制给source
    source.buffer = buffer;

    播放/暂停

    audioBufferSourceNode.buffer = buffer; //回调函数传入的参数 
    audioBufferSourceNode.start(0); //指定位置开始播放
    audioBufferSourceNode.stop();

     更多参考(中文版):https://developer.mozilla.org/zh-CN/docs/Web/API/AudioContext

    更多参考:https://developer.mozilla.org/en-US/docs/Web/API/Web_Audio_API

  • 相关阅读:
    Android Studio学习笔记(1)
    2019全国大学生电子设计大赛总结
    包与常用模块
    模块
    迭代器、生成器与递归调用
    叠加多个装饰器与有参数的装饰器。
    装饰器
    控制指针的移动、函数
    字符编码
    python 数据类型之列表、元组、字典、集合
  • 原文地址:https://www.cnblogs.com/tianma3798/p/6033613.html
Copyright © 2011-2022 走看看