WebRTC의 미디어 부분에서는 카메라 및 마이크와 같은 비디오 및 오디오를 캡처 할 수있는 하드웨어에 액세스하는 방법과 미디어 스트림 작동 방식을 다룹니다. 또한 응용 프로그램이 화면 캡처를 수행하는 방법 인 디스플레이 미디어에 대해서도 다룹니다.
미디어 장치
브라우저에서 지원하는 모든 카메라와 마이크는 navigator.mediaDevices
객체를 통해 액세스 및 관리됩니다. 많은 카메라와 마이크로폰이 USB를 통해 연결되고 애플리케이션 수명주기 동안 연결 및 연결 해제 될 수 있기 때문에 애플리케이션은 현재 연결된 장치 목록을 검색하고 변경 사항을 수신 할 수도 있습니다. 미디어 장치의 상태는 언제든지 변경 될 수 있으므로 변경 사항을 적절하게 처리하려면 응용 프로그램이 장치 변경 사항을 등록하는 것이 좋습니다.
제약
미디어 장치에 액세스 할 때 가능한 한 자세한 제약 조건을 제공하는 것이 좋습니다. 간단한 제약으로 기본 카메라와 마이크를 열 수는 있지만 애플리케이션에 가장 적합한 미디어 스트림과는 거리가 먼 미디어 스트림을 제공 할 수 있습니다.
특정 제약 조건은 MediaTrackConstraint
개체에 정의되어 있습니다. 하나는 오디오 용이고 다른 하나는 비디오 용입니다. 이 객체의 속성은 ConstraintLong
, ConstraintBoolean
, ConstraintDouble
또는 ConstraintDOMString
유형입니다. 특정 값 (예 : 숫자, 부울 또는 문자열), 범위 (최소 및 최대 값이있는 LongRange
또는 DoubleRange
) 또는 ideal
이거나 exact
정의를 가진 객체 일 수 있습니다. 특정 값에 대해 브라우저는 가능한 한 가까운 것을 선택하려고합니다. 범위의 경우 해당 범위에서 가장 좋은 값이 사용됩니다. exact
가 지정되면 해당 제약 조건과 정확히 일치하는 미디어 스트림 만 반환됩니다.
근처에
// Camera with a resolution as close to 640x480 as possible
{
"video": {
"width": 640,
"height": 480
}
}
범위
// Camera with a resolution in the range 640x480 to 1024x768
{
"video": {
"width": {
"min": 640,
"max": 1024
},
"height": {
"min": 480,
"max": 768
}
}
}
정확한
// Camera with the exact resolution of 1024x768
{
"video": {
"width": {
"exact": 1024
},
"height": {
"exact": 768
}
}
}
미디어 스트림의 특정 트랙에있는 실제 구성을 확인하기 위해 현재 적용된 MediaTrackSettings
를 반환하는 MediaStreamTrack.getSettings()
를 호출 할 수 있습니다.
트랙에서 applyConstraints()
를 호출하여 우리가 연 미디어 장치에서 트랙의 제약 조건을 업데이트 할 수도 있습니다. 이를 통해 응용 프로그램은 기존 스트림을 먼저 닫지 않고도 미디어 장치를 재구성 할 수 있습니다.
디스플레이 미디어
화면 캡처 및 녹화를 수행하려는 애플리케이션은 Display Media API를 사용해야합니다. navigator.mediaDevices
일부인 getDisplayMedia()
함수는 getUserMedia()
와 유사하며 디스플레이의 내용 (또는 창과 같은 일부)을 여는 데 사용됩니다. 반환 된 MediaStream
은 getUserMedia()
사용할 때와 동일합니다.
getDisplayMedia()
의 제약 조건은 일반 비디오 또는 오디오 입력에 사용되는 제약 조건과 다릅니다.
{
video: {
cursor: 'always' | 'motion' | 'never',
displaySurface: 'application' | 'browser' | 'monitor' | 'window'
}
}
위의 코드 스 니펫은 화면 녹화에 대한 특수 제약이 어떻게 작동하는지 보여줍니다. 디스플레이 미디어를 지원하는 일부 브라우저에서는 이러한 기능이 지원되지 않을 수 있습니다.
스트림 및 트랙
MediaStream
은 오디오 및 비디오의 트랙 ( MediaStreamTrack
)으로 구성된 미디어 콘텐츠 스트림을 나타냅니다. MediaStreamTrack
객체의 배열을 반환하는 MediaStream.getTracks()
를 호출하여 MediaStream
에서 모든 트랙을 검색 할 수 있습니다.
MediaStreamTrack
MediaStreamTrack
에는 그것이 나타내는 미디어의 종류를 나타내는 audio
또는 video
인 kind
속성이 있습니다. enabled
속성을 전환하여 각 트랙을 음소거 할 수 있습니다. 트랙에는 RTCPeerConnection
의해 소싱되고 원격 피어에서 RTCPeerConnection
여부를 나타내는 부울 속성 remote
가 있습니다.