aboutsummaryrefslogtreecommitdiff
path: root/files/ko/web/api/mediadevices/index.html
diff options
context:
space:
mode:
Diffstat (limited to 'files/ko/web/api/mediadevices/index.html')
-rw-r--r--files/ko/web/api/mediadevices/index.html122
1 files changed, 122 insertions, 0 deletions
diff --git a/files/ko/web/api/mediadevices/index.html b/files/ko/web/api/mediadevices/index.html
new file mode 100644
index 0000000000..86f9133a5c
--- /dev/null
+++ b/files/ko/web/api/mediadevices/index.html
@@ -0,0 +1,122 @@
+---
+title: MediaDevices
+slug: Web/API/MediaDevices
+tags:
+ - API
+ - Interface
+ - Media
+ - Media Capture and Streams API
+ - Media Streams API
+ - MediaDevices
+ - Reference
+ - Screen Capture API
+ - WebRTC
+translation_of: Web/API/MediaDevices
+---
+<div>{{APIRef("Media Capture and Streams")}}</div>
+
+<p><span class="seoSummary"><strong><code>MediaDevices</code></strong> 인터페이스는 카메라, 마이크, 공유 화면 등 현재 연결된 미디어 입력 장치로의 접근 방법을 제공하는 인터페이스입니다. 다르게 말하자면, 미디어 데이터를 제공하는 모든 하드웨어로 접근할 수 있는 방법입니다.</span></p>
+
+<h2 id="속성">속성</h2>
+
+<p>부모 인터페이스인 {{domxref("EventTarget")}}의 속성을 상속합니다.</p>
+
+<h2 id="Handlers" name="Handlers">이벤트</h2>
+
+<dl>
+ <dt><code><a href="/ko/docs/Web/API/MediaDevices/devicechange_event">devicechange</a></code></dt>
+ <dd>사용자 컴퓨터에 미디어 입출력 장치가 추가되거나 제거됐을 때 발생합니다.<br>
+ <code><a href="/ko/docs/Web/API/MediaDevices/ondevicechange">ondevicechange</a></code> 속성으로도 사용할 수 있습니다.</dd>
+</dl>
+
+<h2 id="메서드">메서드</h2>
+
+<p>부모 인터페이스인 {{domxref("EventTarget")}}의 메서드를 상속합니다.</p>
+
+<dl>
+ <dt>{{ domxref("MediaDevices.enumerateDevices", "enumerateDevices()") }}</dt>
+ <dd>시스템에서 사용 가능한 미디어 입출력 장치의 정보를 담은 배열을 가져옵니다.</dd>
+ <dt>{{domxref("MediaDevices.getSupportedConstraints", "getSupportedConstraints()")}}</dt>
+ <dd>{{domxref("MediaStreamTrack")}} 인터페이스가 지원하는 제약을 나타내는 {{domxref("MediaTrackSupportedConstraints")}} 호환 객체를 반환합니다.</dd>
+ <dd class="hidden">See {{SectionOnPage("/en-US/docs/Web/API/Media_Streams_API", "Capabilities and constraints")}} to learn more about constraints and how to use them.</dd>
+ <dt>{{domxref("MediaDevices.getDisplayMedia", "getDisplayMedia()")}}</dt>
+ <dd>{{domxref("MediaStream")}}으로 캡처해 공유나 녹화 용도로 사용할 화면 혹은 화면의 일부(창)를 선택하도록 사용자에게 요청합니다. <code>MediaStream</code>으로 이행하는 {{jsxref("Promise")}}를 반환합니다.</dd>
+ <dt>{{ domxref("MediaDevices.getUserMedia", "getUserMedia()") }}</dt>
+ <dd>사용자에게 권한을 요청한 후, 시스템의 카메라와 오디오 각각 혹은 모두 활성화하여, 장치의 입력 데이터를 비디오/오디오 트랙으로 포함한 {{domxref("MediaStream")}}을 반환합니다.</dd>
+</dl>
+
+<h2 id="예제">예제</h2>
+
+<pre class="brush:js">'use strict';
+
+// Put variables in global scope to make them available to the browser console.
+var video = document.querySelector('video');
+var constraints = window.constraints = {
+ audio: false,
+ video: true
+};
+var errorElement = document.querySelector('#errorMsg');
+
+navigator.mediaDevices.getUserMedia(constraints)
+.then(function(stream) {
+ var videoTracks = stream.getVideoTracks();
+ console.log('Got stream with constraints:', constraints);
+ console.log('Using video device: ' + videoTracks[0].label);
+ stream.onremovetrack = function() {
+ console.log('Stream ended');
+ };
+ window.stream = stream; // make variable available to browser console
+ video.srcObject = stream;
+})
+.catch(function(error) {
+ if (error.name === 'ConstraintNotSatisfiedError') {
+ errorMsg('The resolution ' + constraints.video.width.exact + 'x' +
+ constraints.video.width.exact + ' px is not supported by your device.');
+ } else if (error.name === 'PermissionDeniedError') {
+ errorMsg('Permissions have not been granted to use your camera and ' +
+ 'microphone, you need to allow the page access to your devices in ' +
+ 'order for the demo to work.');
+ }
+ errorMsg('getUserMedia error: ' + error.name, error);
+});
+
+function errorMsg(msg, error) {
+ errorElement.innerHTML += '&lt;p&gt;' + msg + '&lt;/p&gt;';
+ if (typeof error !== 'undefined') {
+ console.error(error);
+ }
+}</pre>
+
+<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('Media Capture', '#mediadevices', 'MediaDevices')}}</td>
+ <td>{{Spec2('Media Capture')}}</td>
+ <td>Initial definition</td>
+ </tr>
+ </tbody>
+</table>
+
+<h2 id="브라우저_호환성">브라우저 호환성</h2>
+
+<div>
+
+
+<p>{{Compat("api.MediaDevices")}}</p>
+</div>
+
+<h2 id="같이_보기">같이 보기</h2>
+
+<ul>
+ <li>인터페이스가 속한 <a href="/ko/docs/Web/API/Media_Streams_API">Media Capture and Streams API</a></li>
+ <li>{{domxref("MediaDevices.getDisplayMedia", "getDisplayMedia()")}} 메서드를 정의하는 <a href="/ko/docs/Web/API/Screen_Capture_API">Screen Capture API</a></li>
+ <li><a href="/ko/docs/Web/API/WebRTC_API">WebRTC API</a></li>
+ <li>장치에 접근할 때 사용할 <code>MediaDevices</code> 객체의 참조를 반환하는 {{domxref("Navigator.mediaDevices")}}</li>
+</ul>