aboutsummaryrefslogtreecommitdiff
path: root/files/zh-cn/web/api/audiobuffersourcenode/index.html
blob: d811cef4d6ce4f56d3593bddd4d46832975234a7 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
---
title: AudioBufferSourceNode
slug: Web/API/AudioBufferSourceNode
translation_of: Web/API/AudioBufferSourceNode
---
<p>{{APIRef("Web Audio API")}}</p>

<div class="summary">
<p><span class="seoSummary"><strong><code>AudioBufferSourceNode</code></strong><strong> </strong>接口继承自</span>{{domxref("AudioScheduledSourceNode")}} <span class="seoSummary">,表现为一个音频源,它包含了一些写在内存中的音频数据,通常储存在一个ArrayBuffer对象中。在处理有严格的时间精确度要求的回放的情形下它尤其有用。比如播放那些需要满足一个指定节奏的声音或者那些储存在内存而不是硬盘或者来自网络的声音。为了播放那些有时间精确度需求但来自网络的流文件或者来自硬盘,则使用</span>{{domxref("AudioWorkletNode")}}来实现回放。</p>

<p>{{InheritanceDiagram}}</p>
</div>

<p><code>AudioBufferSourceNode</code> 没有输入却有一个输出,其通道数与其 {{domxref("AudioBufferSourceNode.buffer", "buffer")}} 属性所指定的 <code>AudioBuffer</code> 相同。如果没有设置 buffer,也就是说 <code>buffer</code> 属性是 <code>null</code> 的话,输出将包含一个无声的单通道(每个采样点均为0)。</p>

<p>一个 {{domxref("AudioBufferSourceNode")}} 只能被播放一次,也就是说,每次调用 {{domxref("AudioScheduledSourceNode.start", "start()")}} 之后,如果还想再播放一遍同样的声音,那么就需要再创建一个 <code>AudioBufferSourceNode</code>。庆幸的是,创建该节点的代价并不大,并且想要多次播放声音的话,实际上 <code>AudioBuffer</code> 也可以被重用。事实上,你可以用一种“阅后即焚”的方式来使用这些节点:创建节点,调用 <code>start()</code> 开始播放声音,然后,你甚至不需要再保留这个节点的引用了。声音播放完成之后,垃圾收集器会找个恰当的时机回收资源。</p>

<p><code>多次调用 AudioBufferSourceNode.stop()</code> 是允许的。如果这时候 <code>AudioBufferSourceNode</code> 还没有到达缓冲区末尾的话,最近一次的调用将替换上一次的调用。</p>

<p><br>
 <img alt="The AudioBufferSourceNode takes the content of an AudioBuffer and m" src="https://mdn.mozillademos.org/files/9717/WebAudioAudioBufferSourceNode.png" style="display: block; height: 193px; margin: 0px auto; width: 365px;"></p>

<table class="properties">
 <tbody>
  <tr>
   <th scope="row">输入数量</th>
   <td><code>0</code></td>
  </tr>
  <tr>
   <th scope="row">输出数量</th>
   <td><code>1</code></td>
  </tr>
  <tr>
   <th scope="row">频道数量</th>
   <td>由相关的 {{domxref("AudioBuffer")}} 定义</td>
  </tr>
 </tbody>
</table>

<h2 id="属性">属性</h2>

<p><em>从父级的 </em><em>{{domxref("AudioNode")}} 继承属性</em>.</p>

<dl>
 <dt>{{domxref("AudioBufferSourceNode.buffer")}}</dt>
 <dd>是一个 {{domxref("AudioBuffer")}} 它定义了要播放的音频,当设置它的值为0时,它会定义一个静默的单通道。</dd>
 <dt>{{domxref("AudioBufferSourceNode.detune")}}</dt>
 <dd>Is a <a href="/zh-CN/docs/DOM/AudioParam#k-rate">k-rate</a> {{domxref("AudioParam")}} representing detuning of oscillation in <a href="http://en.wikipedia.org/wiki/Cent_%28music%29">cents</a>. Its default value is <code>0</code>.</dd>
 <dt>{{domxref("AudioBufferSourceNode.loop")}}</dt>
 <dd>Is a Boolean attribute indicating if the audio asset must be replayed when the end of the {{domxref("AudioBuffer")}} is reached. Its default value is <code>false</code>.</dd>
 <dt>{{domxref("AudioBufferSourceNode.loopStart")}}</dt>
 <dd>Is a double value indicating, in seconds, where in the {{domxref("AudioBuffer")}} the restart of the play must happen. Its default value is <code>0</code>.</dd>
 <dt>{{domxref("AudioBufferSourceNode.loopEnd")}}</dt>
 <dd>Is a double value indicating, in seconds, where in the {{domxref("AudioBuffer")}} the replay of the play must stop (and eventually loop again). Its default value is <code>0</code>.</dd>
 <dt>{{domxref("AudioBufferSourceNode.playbackRate")}}</dt>
 <dd>Is an <a href="/en-US/docs/Web/API/AudioParam#a-rate">a-rate</a> {{domxref("AudioParam")}} that defines the speed factor at which the audio asset will be played. Since no pitch correction is applied on the output, this can be used to change the pitch of the sample.</dd>
</dl>

<h3 id="事件">事件</h3>

<dl>
 <dt>{{domxref("AudioBufferSourceNode.onended")}}</dt>
 <dd>是一个 {{event("Event_handlers", "event handler")}} 类型,包含了与 {{event("ended_(Web_Audio)", "ended")}} 相关联的结束事件。</dd>
</dl>

<h2 id="方法">方法</h2>

<p><em>从父级的 </em><em>{{domxref("AudioNode")}} 继承方法</em></p>

<dl>
 <dt>{{domxref("AudioBufferSourceNode.start()")}}</dt>
 <dd>Schedules the start of the playback of the audio asset.</dd>
 <dt>{{domxref("AudioBufferSourceNode.stop()")}}</dt>
 <dd>Schedules the end of the playback of an audio asset.</dd>
</dl>

<h2 id="例子">例子</h2>

<p>在这个例子中, 我们将会创建一个2秒的缓冲器,并用白噪音填充它, 然后通过{{domxref("AudioBufferSourceNode")}}来播放它.  注释里说明了它的功能.</p>

<div class="note">
<p><span style="font-size: 14px;"><strong>注意</strong></span>: 你可以 <a class="external external-icon" href="http://mdn.github.io/audio-buffer/">查看在线演示</a> 或 <a class="external external-icon" href="https://github.com/mdn/audio-buffer">查看源代码</a>.</p>
</div>

<pre class="brush: js">var audioCtx = new (window.AudioContext || window.webkitAudioContext)();
var button = document.querySelector('button');
var pre = document.querySelector('pre');
var myScript = document.querySelector('script');

pre.innerHTML = myScript.innerHTML;

// Stereo
var channels = 2;
// Create an empty two-second stereo buffer at the
// sample rate of the AudioContext
var frameCount = audioCtx.sampleRate * 2.0;

var myArrayBuffer = audioCtx.createBuffer(2, frameCount, audioCtx.sampleRate);

button.onclick = function() {
  // Fill the buffer with white noise;
  //just random values between -1.0 and 1.0
  for (var channel = 0; channel &lt; channels; channel++) {
   // This gives us the actual ArrayBuffer that contains the data
   var nowBuffering = myArrayBuffer.getChannelData(channel);
   for (var i = 0; i &lt; frameCount; i++) {
     // Math.random() is in [0; 1.0]
     // audio needs to be in [-1.0; 1.0]
     nowBuffering[i] = Math.random() * 2 - 1;
   }
  }

  // Get an AudioBufferSourceNode.
  // This is the AudioNode to use when we want to play an AudioBuffer
  var source = audioCtx.createBufferSource();
  // set the buffer in the AudioBufferSourceNode
  source.buffer = myArrayBuffer;
  // connect the AudioBufferSourceNode to the
  // destination so we can hear the sound
  source.connect(audioCtx.destination);
  // start the source playing
  source.start();
}</pre>

<div class="note">
<p><span style="font-size: 14px;"><strong>注意</strong></span>: 音频数据解码的例子请查看 {{domxref("AudioContext.decodeAudioData")}} 页面.</p>
</div>

<h2 id="规范">规范</h2>

<table class="standard-table">
 <tbody>
  <tr>
   <th scope="col">Specification</th>
   <th scope="col">Status</th>
   <th scope="col">Comment</th>
  </tr>
  <tr>
   <td>{{SpecName('Web Audio API', '#the-audiobuffersourcenode-interface', 'AudioBufferSourceNode')}}</td>
   <td>{{Spec2('Web Audio API')}}</td>
   <td> </td>
  </tr>
 </tbody>
</table>

<h2 id="浏览器兼容性">浏览器兼容性</h2>

<div>{{CompatibilityTable}}</div>

<div id="compat-desktop">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Feature</th>
   <th>Chrome</th>
   <th>Firefox (Gecko)</th>
   <th>Internet Explorer</th>
   <th>Opera</th>
   <th>Safari (WebKit)</th>
  </tr>
  <tr>
   <td>Basic support</td>
   <td>14 {{property_prefix("webkit")}}<sup>[1]</sup></td>
   <td>{{CompatGeckoDesktop("23.0")}}</td>
   <td>{{CompatNo}}</td>
   <td>15 {{property_prefix("webkit")}}<br>
    22</td>
   <td>6 {{property_prefix("webkit")}}</td>
  </tr>
  <tr>
   <td><code>detune</code> property</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatGeckoDesktop("40.0")}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatUnknown}}</td>
  </tr>
 </tbody>
</table>
</div>

<div id="compat-mobile">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Feature</th>
   <th>Android</th>
   <th>Chrome</th>
   <th>Firefox Mobile (Gecko)</th>
   <th>Firefox OS</th>
   <th>IE Phone</th>
   <th>Opera Mobile</th>
   <th>Safari Mobile</th>
  </tr>
  <tr>
   <td>Basic support</td>
   <td>{{CompatNo}}</td>
   <td>28 {{property_prefix("webkit")}}<sup>[1]</sup></td>
   <td>{{CompatGeckoMobile("25.0")}}</td>
   <td>1.2</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
   <td>{{property_prefix("webkit")}}</td>
  </tr>
  <tr>
   <td><code>detune</code> property</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatUnknown}}</td>
  </tr>
 </tbody>
</table>
</div>

<p>[1] As of Chrome 42.0 setting AudioBufferSourceNode.buffer more than once is deprecated. A deprecation message is displayed if the buffer attribute is assigned more than once.</p>

<h2 id="相关页面">相关页面</h2>

<ul>
 <li><a href="/en-US/docs/Web/API/Web_Audio_API/Using_Web_Audio_API">Using the Web Audio API</a></li>
</ul>