blob: b42947de88fc0dafabfeb46561e8c69a64a6674c (
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
|
---
title: AudioContext
slug: Web/API/AudioContext
tags:
- 오디오
translation_of: Web/API/AudioContext
---
<p>{{APIRef()}}</p>
<div>
<p><code>AudioContext는 오디오 모듈과 연동시켜 {{domxref("AudioNode")}}를 통해 음원을 그래프화 시킨다. 오디오 컨택스트는 음원정보를 담은 노드를 생성하거나 음원을 실행또는 디코딩 시키는 일을 한다.</code> 당신이 음원을 다룰일이 있다면 우선 AudioContext를 생성해야 관련된 모든 작업을 진행할 수 있다.</p>
<p><code>AudioContext 이벤트의 타겟이 되므로 </code>{{domxref("EventTarget")}} 인터페이스를 통해 구현되어야 한다.</p>
</div>
<h2 id="Properties">Properties</h2>
<dl>
<dt>{{domxref("AudioContext.currentTime")}} {{readonlyInline}}</dt>
<dd>double형으로 리턴되는 음원을 스케쥴링하기 위한 초단위로 증가하는 시간을 나타낸다. 이는 0부터 시작해서 진행되며 멈추거나 일시정지, 리셋을 할수는 없다.</dd>
<dt>{{domxref("AudioContext.destination")}} {{readonlyInline}}</dt>
<dd>{{domxref("AudioDestinationNode")}} 은 컨텍스트 상의 모든 음원의 마지막 지점을 리턴한다. It can be thought of as the audio-rendering device.</dd>
<dt>{{domxref("AudioContext.listener")}} {{readonlyInline}}</dt>
<dd>{{domxref("AudioListener")}} 오브젝트를 리턴하여 3D 사운드를 다루기 위해 사용된다.</dd>
<dt>{{domxref("AudioContext.sampleRate")}} {{readonlyInline}}</dt>
<dd>컨택스트 상의 모든 노드에서 사용될 샘플rate를 float형으로 매초 리턴한다. {{domxref("AudioContext")}} 의 sample-rate는 변경되지 않는다.</dd>
<dt>{{domxref("AudioContext.mozAudioChannelType")}} {{ non-standard_inline() }} {{readonlyInline}}</dt>
<dd>Firefox OS의 디바이스에서 재생될 {{domxref("AudioContext")}}상의 음원의 채널을 리턴받는다.</dd>
</dl>
<h2 id="Methods">Methods</h2>
<p>{{domxref("EventTarget")}}<em>을 부모로 가지는 메서드</em>.</p>
<dl>
<dt>{{domxref("AudioContext.createBuffer()")}}</dt>
<dd>새롭게 빈 {{ domxref("AudioBuffer") }}를 생성해 음원데이터를 넣거나 {{domxref("AudioBufferSourceNode") }}를 통해 재생하는 역할을 한다.</dd>
<dt>{{domxref("AudioContext.createBufferSource()")}}</dt>
<dd>{{domxref("AudioBufferSourceNode")}}를 생성하여 {{ domxref("AudioBuffer")}} 객체상에 담긴 데이터를 재생하거나 수정할때 사용된다. {{ domxref("AudioBuffer")}}들은 {{domxref("AudioContext.createBuffer")}}을 통해 생성이 되거나 {{domxref("AudioContext.decodeAudioData")}}에 의해 음원트랙이 성공적으로 디코드 되었을 경우에 리턴이 된다.</dd>
<dt>{{domxref("AudioContext.createMediaElementSource()")}}</dt>
<dd>{{domxref("HTMLMediaElement")}}와 연관된 {{domxref("MediaElementAudioSourceNode")}}을 생성한다. 이는 {{HTMLElement("video")}} 나 {{HTMLElement("audio")}} 를 재생하거나 음원을 조작할때 사용한다.</dd>
<dt>{{domxref("AudioContext.createMediaStreamSource()")}}</dt>
<dd>{{domxref("MediaStream")}} 과 연관된 {{domxref("MediaStreamAudioSourceNode")}}를 생성하여 내 컴퓨터의 마이크나 다른 소스를 통해 발생한 오디오 스트림의 정보를 보여준다.</dd>
<dt>{{domxref("AudioContext.createMediaStreamDestination()")}}</dt>
<dd>{{domxref("MediaStream")}} 과 연관된 {{domxref("MediaStreamAudioDestinationNode")}}를 생성하여 로컬파일로 저장된 혹은 다른 컴퓨터에 저장된 오디오 스트림정보를 보여준다.</dd>
<dt>{{domxref("AudioContext.createScriptProcessor()")}}</dt>
<dd>{{domxref("ScriptProcessorNode")}} 자바스크립트를 통해 음원의 진행상태에 직접접근에 사용된다.</dd>
<dt>{{domxref("AudioContext.createAnalyser()")}}</dt>
<dd>{{domxref("AnalyserNode")}}를 생성하여 오디오의 시간이나 주파수 정보를 알아내어 데이터를 시각화 하는 작업등에 사용을 할 수 있다.</dd>
<dt>{{domxref("AudioContext.createBiquadFilter()")}}</dt>
<dd>{{domxref("BiquadFilterNode")}} 를 생성하여 high-pass, low-pass, band-pass등 2차 필터의 정보를 설정 할 수 있다.</dd>
<dt>{{domxref("AudioContext.createChannelMerger()")}}</dt>
<dd>{{domxref("ChannelMergerNode")}} 두개의 오디오 스트림 정보를 하나의 오디오 스트림으로 합칠 수 있다.</dd>
<dt>{{domxref("AudioContext.createChannelSplitter()")}}</dt>
<dd>{{domxref("ChannelSplitterNode")}}를 통해 오디오 스트림의 각각의 채널정보에 접근 할 때와 스트림을 구분지어 처리할때 사용한다.</dd>
<dt>{{domxref("AudioContext.createConvolver()")}}</dt>
<dd>{{domxref("ConvolverNode")}}를 통해 convolution effects를 당신의 오디오 그래프에 적용할 때 사용한다. 예를 들면 reverberation effect 가 있다.</dd>
<dt>{{domxref("AudioContext.createDelay()")}}</dt>
<dd>{{domxref("DelayNode")}}를 통해 특정 시간동안 오디오의 입력신호를 딜레이 시킨다. 이 노드는 Web Audio API에서 피드백 루프를 생성할때 유용하다.</dd>
<dt>{{domxref("AudioContext.createDynamicsCompressor()")}}</dt>
<dd>{{domxref("DynamicsCompressorNode")}}는 음원의 신호를 암축할때 사용된다.</dd>
<dt>{{domxref("AudioContext.decodeAudioData()")}}</dt>
<dd>{{domxref("ArrayBuffer") }} 에 담긴 오디오 파일을 비동기적으로 디코딩 시킬때 사용한다. 이 경우에 일반적으로 ArrayBuffer는 <code>arraybuffer의 <code>responseType을 세팅한 후 </code></code>{{domxref("XMLHttpRequest")}}의 <code>response를 통해 데이터가 로드된다.</code> 이 메서드는 오직 완벽한 파일에서만 동작을 한다. 파편화된 오디오 파일들에서는 동작하지 않는다.</dd>
<dt>{{domxref("AudioContext.createGain()")}}</dt>
<dd>{{domxref("GainNode")}}를 생성하여 오디오 그래프의 전반적인 볼륨을 조절할때 사용한다.</dd>
<dt>{{domxref("AudioContext.createOscillator()")}}</dt>
<dd>{{domxref("OscillatorNode")}}를 통해 시간별 음원의 파형을 볼수 있다. 이는 일반적으로 음색(a tone) 을 생성한다.</dd>
<dt>{{domxref("AudioContext.createPanner()")}}</dt>
<dd>{{domxref("PannerNode")}}를 통해 입력되는 음원을 3차원으로 공간화 시킬때 사용한다.</dd>
<dt>{{domxref("AudioContext.createPeriodicWave()")}}</dt>
<dd>{{domxref("PeriodicWave")}}를 생성하여 {{ domxref("OscillatorNode") }}를 통해 출력되는 파형을 확인할수 있다.</dd>
<dt>{{domxref("AudioContext.createWaveShaper()")}}</dt>
<dd>{{domxref("WaveShaperNode")}}는 non-linear distortion effects를 적용할 때 사용한다.</dd>
<dt>{{domxref("AudioContext.createAudioWorker()")}}</dt>
<dd>{{domxref("AudioWorkerNode")}}는 Web Worker의 스레드와 상호작용을 하며 오디오를 생성, 처리, 분석등의 작업을 직접한다. 이는 2014년 8월 29일에 스펙으로 추가되어 아직 다른 브라우저에는 적용되지 않은 상태이다.</dd>
</dl>
<h2 id="Obsolete_methods">Obsolete methods</h2>
<dl>
<dt>{{domxref("AudioContext.createJavaScriptNode()")}}</dt>
<dd>Creates a {{domxref("JavaScriptNode")}}, used for direct audio processing via JavaScript. This method is obsolete, and has been replaced by {{domxref("AudioContext.createScriptProcessor()")}}.</dd>
<dt>{{domxref("AudioContext.createWaveTable()")}}</dt>
<dd>Creates a {{domxref("WaveTableNode")}}, used to define a periodic waveform. This method is obsolete, and has been replaced by {{domxref("AudioContext.createPeriodicWave()")}}.</dd>
</dl>
<h2 id="Examples">Examples</h2>
<p>Basic audio context declaration:</p>
<pre class="brush: js">var audioCtx = new AudioContext;</pre>
<p>Cross browser variant:</p>
<pre class="brush: js">var AudioContext = window.AudioContext || window.webkitAudioContext;
var audioCtx = new AudioContext();
var oscillatorNode = audioCtx.createOscillator();
var gainNode = audioCtx.createGain();
var finish = audioCtx.destination;
// etc.</pre>
<h2 id="Specifications">Specifications</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-audiocontext-interface', 'AudioContext')}}</td>
<td>{{Spec2('Web Audio API')}}</td>
<td> </td>
</tr>
</tbody>
</table>
<h2 id="Browser_compatibility">Browser compatibility</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>{{CompatChrome(10.0)}}{{property_prefix("webkit")}}</td>
<td>{{CompatGeckoDesktop(25.0)}} </td>
<td>{{CompatNo}}</td>
<td>15.0{{property_prefix("webkit")}}<br>
22 (unprefixed)</td>
<td>6.0{{property_prefix("webkit")}}</td>
</tr>
</tbody>
</table>
</div>
<div id="compat-mobile">
<table class="compat-table">
<tbody>
<tr>
<th>Feature</th>
<th>Android</th>
<th>Firefox Mobile (Gecko)</th>
<th>Firefox OS</th>
<th>IE Mobile</th>
<th>Opera Mobile</th>
<th>Safari Mobile</th>
<th>Chrome for Android</th>
</tr>
<tr>
<td>Basic support</td>
<td>{{CompatUnknown}}</td>
<td>26.0</td>
<td>1.2</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatUnknown}}</td>
<td>33.0</td>
</tr>
</tbody>
</table>
</div>
<h2 id="See_also">See also</h2>
<ul style="margin-left: 40px;">
<li><a href="/en-US/docs/Web_Audio_API/Using_Web_Audio_API">Using the Web Audio API</a></li>
</ul>
|
