Sonorous.js 是一个 JavaScript 音频库,可简化 Web 音频的处理,使音频能够轻松集成到 Web 应用程序和游戏中。作为 WebAudio API 的抽象,Sonorous.js 为需要的人提供细粒度的控制,同时为您处理任何跨浏览器问题。
由团队从
音箱
轨道混音器
弦乐大师
请参阅存储库的examples/
目录以获取源代码。
首先,运行npm install --save sonorous
。
要使用 Sonorous.js,需要它或将其导入到您的文件中。
ES6
import Sonorous from 'sonorous';
CommonJS
const Sonorous = require('sonorous');
Sonorous 是一个管理器,负责处理声纳的添加和删除。声纳可以被认为是一个音频文件的包装。每个sonor都有自己的功能,如play()
、 pause()
、 volume
等。您还可以通过Sonorous实例在所有sonor上设置全局属性( masterVolume
、 muteAll
等)。
例子:
let mySonor = Sonorous.addSonor('./test_audio/test_sound_1.mp3');
mySonor.play(); // begins to play test_sound_1.mp3
mySonor.volume = 0.5; // sets the volume of the sonor to 0.5
Sonorous.muteAll = true; // mutes all sonors
mySonor.stop(); // stops the playback of test_sound_1.mp3
请参阅 API 部分了解更多详细信息。
Sonorous 是一个单例,将管理所有 Sonor 对象。
Sonor[]
(只读)添加到此管理器的所有 Sonor 对象的数组。
AudioContext
(只读)返回 Sonorous 使用的当前音频上下文。
number
这是一个读/写属性,连接到 masterGain 节点,该节点将为所有 Sonor 对象设置音量。有效值介于 0 和 1 之间。
boolean
这是一个读/写属性,可将所有 Sonor 对象静音/取消静音。
boolean
如果支持 WebAudio,则返回 true;如果不支持,则返回 false。
Sonor
创建一个 Sonor 对象并返回它(如果成功)。
参数 | 类型 | 描述 |
---|---|---|
源代码 | string , string[] , SonorSrc , SonorSrc[] | 该声音关联的媒体。如果您传入各种格式的数组,它将采用第一个适用于当前浏览器的格式。如果您的源 url 没有扩展名,您可以使用下面定义的 SonorSrc 对象手动指定。 |
选项 | object | 可选配置对象。请参阅下面的选项。 |
addSonor()
的配置选项:
选项 | 类型 | 默认 | 描述 |
---|---|---|---|
ID | string | 随机生成的 | 唯一的 ID。如果您不传入一个对象,则会为此对象创建一个。 |
预载 | boolean | true | 如果为 true,将尝试自动加载 url。如果为 false,则调用代码必须显式调用load() 。 |
体积 | number | 1.0 | 声音的初始音量。 |
环形 | boolean | false | 确定音频是否应永远循环。 |
自动播放 | boolean | false | 确定音频是否应在加载时立即播放。 |
静音 | boolean | false | 加载后静音。 |
池大小 | number | 1 | 可播放的音频片段总数。增加此数字可以让您在初始播放完成之前开始多次同时播放相同的声音。 |
优化 | string | 'time' | 可以是'time' 或'memory' 。这决定了解码后的缓冲区是否会被缓存。默认情况下,会的。如果内存是一个问题,那么将其设置为“内存”,并在开始播放之前解码缓冲区时预计会有一点延迟。 |
财产 | 类型 | 描述 |
---|---|---|
网址 | string | 音频的源 URL,不带扩展名。 |
格式 | string | 为此音频源手动指定的格式。 |
例子:
let mySonor = Sonorous.addSonor('./test_audio/test_sound_1.mp3', {
id: 'myFirstSonor',
preload: false,
volume: 0.5,
poolSize: 3 });
let testSoundSonor = Sonorous.addSonor(
{
url: './test_audio/test_sound_2',
format: 'mp3'
},
{ id: 'test_sound_2'});
从管理器中删除 Sonor 对象。这将卸载并销毁声音,并立即停止与该声音相关的所有进程。
删除任何现有的声纳对象并重置音频上下文。
销毁所有 Sonor 对象
Sonor
返回 Sonor 对象
例子:
Sonorous.addSonor('./test_audio/test_sound_1.mp3', { id: 'mySonorId'});
let mySonor = Sonorous.get('mySonorId');
boolean
如果 Sonorous 有一个 Sonor 与传入的 id 匹配,则返回 true
当音频解锁时(通过用户与页面的交互)将触发。某些浏览器不允许在用户以某种方式与页面交互之前播放音频。一旦音频可以自由播放,此事件就会触发。
该模块包含控制声音的大部分功能,包括调节音量、播放、暂停等。如果 AudioContext 尚未解锁(通过用户手势等),所有操作都将进入队列。一旦 AudioContext 解锁并且缓冲区已加载,这些操作将立即执行。
string
(只读)一个只读属性,返回该声音对象的唯一 ID。 id 可以在初始化期间选择性地提供(有关更多信息,请参阅 Sonorous 的 addSonor())。如果在初始化期间未提供 ID,则会将随机生成的字母数字字符串指定为 id。 Sonorous 可以使用Sonorous.get(id)
函数通过 id 检索 Sonor 对象。
string
(只读)返回该对象的源音频的 url。
boolean
(只读)如果声纳在初始化期间设置为预加载,则返回 true。
string
(只读)反映声纳的负载状态。可以是'loading'
、 'loaded'
或'unloaded'
。
例子:
let mySonor = Sonorous.addSonor('./test_audio/test_sound_1.mp3', { preload: false });
console.log(mySonor.state); // prints out 'unloaded'
mySonor.load();
console.log(mySonor.state); // prints out 'loading'
number
(只读)返回声纳的持续时间。请注意,该值仅在加载声纳时才可用。如果声纳已卸载,则返回 0。
boolean
(只读)如果当前正在播放声音,则返回 true,否则返回 false。
number
(只读)返回声音播放的进度。如果 poolSize > 1,则将使用第一个活动音频片段返回该值。
number
控制池中音频段总数的读/写公共属性。如果您想开始同时播放相同的声音,请增加池的大小。默认为 1。
一旦池大小增加,setter/getter 将表现如下: 任何 setter 都将应用于所有活动段。任何获取器都将使用第一个活动音频段来返回所请求的信息。 (“活动段”是指已从池中提取且当前正在使用的段。)
例子:
let mySonor = Sonorous.addSonor('./test_audio/test_sound_1.mp3');
mySonor.poolSize = 2;
mySonor.play();
setTimeout(() => { mySonor.play(); }, 1000); // will result in the same audio being played twice, with the second playback 1s behind the first one.
number
控制该声音的播放速率的读/写公共属性。如果 poolSize > 1,则将使用第一个活动音频片段来返回该值。
boolean
控制声音是否循环的读/写公共属性。设置此属性时,它将应用于所有活动段。
number
控制该声音音量的读/写公共属性。设置此属性时,它将应用于所有活动段。
boolean
控制声音是否静音的读/写公共属性。设置此属性时,它将应用于所有活动段。
将播放音频源。如果尚未加载声纳,它将加载声纳并在加载后播放。如果音频片段池大于 1,则我们根据需要从池中提取片段。 “活动段”是已经从池中拉出并且当前正在使用的段。播放逻辑如下:
if there are no active segments:
retrieve one from the pool and play it.
if there are active segments:
if none are currently playing:
play all active segments
else:
retrieve/play a segment from the pool
if there are no available segments in the pool:
do nothing and report an error
将暂停所有活动的音频片段,但不会将它们返回到池中。
将停止所有活动的音频片段并将它们返回到池中。
在提供的淡入淡出持续时间内,将音频从当前音量淡入目标音量。如果提供了 startTime 并且大于 audioContext 的当前时间,则淡入淡出将从该点开始。否则,它将立即开始。淡入淡出持续时间应以秒为单位。
会将播放移至传入的时间(以秒为单位)。
将加载缓冲区并准备播放音频片段。
将删除缓冲区并将所有活动音频片段返回到池中。
Sonor 对象是一个事件发射器(开/关/一次)。请参阅下面的可用事件列表。
声音加载时触发
参数 | 类型 | 描述 |
---|---|---|
声纳对象 | 索诺尔 | 进行操作的 Sonor 实例 |
播放开始时触发
参数 | 类型 | 描述 |
---|---|---|
声纳对象 | 索诺尔 | 进行操作的 Sonor 实例 |
当声音暂停时触发
参数 | 类型 | 描述 |
---|---|---|
声纳对象 | 索诺尔 | 进行操作的 Sonor 实例 |
当声音停止播放时触发
参数 | 类型 | 描述 |
---|---|---|
声纳对象 | 索诺尔 | 进行操作的 Sonor 实例 |
当声音到达其持续时间结束时将触发
参数 | 类型 | 描述 |
---|---|---|
声纳对象 | 索诺尔 | 进行操作的 Sonor 实例 |
当手动更改 currentTime 时将触发
参数 | 类型 | 描述 |
---|---|---|
声纳对象 | 索诺尔 | 进行操作的 Sonor 实例 |
寻找位置 | 数字 | Sonor 寻求的时间码 |
当音量变化时触发(通过音量或静音)
参数 | 类型 | 描述 |
---|---|---|
声纳对象 | 索诺尔 | 进行操作的 Sonor 实例 |
新卷 | 数字 | Sonor 设置的新音量 |
当播放速率改变时会触发
参数 | 类型 | 描述 |
---|---|---|
声纳对象 | 索诺尔 | 进行操作的 Sonor 实例 |
新的播放速率 | 数字 | Sonor 设置的新播放速率 |
当淡入淡出结束时触发
参数 | 类型 | 描述 |
---|---|---|
声纳对象 | 索诺尔 | 进行操作的 Sonor 实例 |
如果 Sonor 操作期间发生任何错误,将触发
参数 | 类型 | 描述 |
---|---|---|
声纳对象 | 索诺尔 | 进行操作的 Sonor 实例 |
错误 | 细绳 | 错误信息 |
本地拥有存储库后,运行yarn install
来安装依赖项。
npm run build
将构建 Sonorous 的未缩小版本。npm run build:production
将构建 Sonorous 的缩小版和压缩版。npm run start-dev
将构建未缩小的 Sonorous 并打开一个带有音频控件的简单 html 页面。您可以通过那里手动测试大部分 Sonorous 功能。npm run test
将运行所有单元测试。 (单元测试是使用 Jest 编写的)我们积极欢迎拉取请求和对代码库的拟议更改。贡献时请遵循以下步骤。
develop
中分叉和分支,并按照本地开发指南来构建。只要有 WebAudio,就支持 Sonorous。单击此处查看完整列表。