미디어스트림 이미지 캡처

1. 소개

이 문서에서 정의한 API는 유효한 MediaStreamTrack [GETUSERMEDIA]를 통해 참조되는 사진 장치에서 이미지를 캡처합니다. 생성된 이미지는 Blob ( takePhoto() 메서드 참조) 형태이거나 ImageBitmap ( grabFrame() 참조) 형태일 수 있습니다.

기능과 설정을 읽고 제약을 적용하는 방법은 비디오 MediaStreamTrack 에 영향을 주는지 여부에 따라 두 가지 방식 중 하나로 진행됩니다. 사진 관련 기능과 현재 설정은 getPhotoCapabilities()/getPhotoSettings() 를 통해 조회할 수 있고, takePhoto()의 PhotoSettings 인자를 통해 설정할 수 있습니다. 비디오 관련 기능과 현재 설정 및 제약은 MediaStreamTrack 확장 메커니즘을 통해 조작됩니다.

2. 보안 및 개인정보 보호 고려사항

보안 및 개인정보 보호 고려사항은 [GETUSERMEDIA]에서 논의된 내용이 이 확장 명세에도 적용됩니다.

또한, 구현자는 캡처된 이미지로부터 추가적인 개인정보 유출이 발생하지 않도록 주의해야 합니다. 예를 들어, 디지털화된 이미지의 메타데이터(EXIF 등)에 사용자의 위치를 포함시키면 사용자가 예상한 것보다 더 많은 개인정보가 전송될 수 있습니다.

3. 이미지 캡처 API

User Agent는 Image Capture API를 구현하기 위해 Promise를 지원해야 합니다. Promise 객체는 resolve()와 reject() 메서드를 가진 resolver 객체가 있다고 가정합니다.

[Exposed=Window, SecureContext]
interface ImageCapture {
   constructor(MediaStreamTrack videoTrack);
   Promise<Blob>              takePhoto(optional PhotoSettings photoSettings = {});
   Promise<PhotoCapabilities> getPhotoCapabilities();
   Promise<PhotoSettings>     getPhotoSettings();

   Promise<ImageBitmap>       grabFrame();

   readonly attribute MediaStreamTrack track;
};

takePhoto() 는 Blob 형태로 인코딩된 캡처 이미지를 반환하며, grabFrame() 는 track 비디오 피드의 스냅샷을 인코딩되지 않은 ImageBitmap으로 반환합니다.

3.1. 속성

track, 타입 MediaStreamTrack, 읽기 전용: 생성자에 전달된 MediaStreamTrack입니다.

3.2. 메서드

ImageCapture(MediaStreamTrack videoTrack)

파라미터	타입	Nullable	Optional	설명
videoTrack	`MediaStreamTrack`	✘	✘	데이터 소스로 사용할 `MediaStreamTrack`입니다. 이 값은 `track` 속성의 값이 됩니다. 생성자에 전달되는 `MediaStreamTrack`의 `kind` 속성은 `"video"`로 설정되어 있어야 하며, 그렇지 않으면 `DOMException`의 `NotSupportedError` 타입이 throw됩니다.

takePhoto(optional PhotoSettings photoSettings)

takePhoto() 는 track을 소스로 하는 비디오 캡처 장치를 이용하여 단일 사진 노출 결과를 생성하고, 설정된 PhotoSettings 을 포함하여 성공 시 Blob 형태로 인코딩된 이미지를 반환합니다. 이 메서드가 호출되면 User Agent는 다음 절차를 실행해야 합니다:

생성자에 제공된 readyState 가 track 에 대해 live가 아니면, a promise rejected with 새로운 DOMException (이름은 InvalidStateError)을 반환하고, 이후 절차를 중단한다.
p를 새로운 promise로 둔다.
다음 절차를 병렬로 실행한다:
1. track 의 소스에서 정의된 photoSettings 를 반영하여 Blob 하나의 정지 이미지를 만든다. 구현 방법은 장치에 따라 다르다.
  장치는 일시적으로 스트리밍을 멈추고, 적절한 사진 설정으로 재구성 후 사진을 찍고, 다시 스트리밍을 재개할 수 있습니다. 이 경우, 스트리밍의 중단 및 재개는 해당 track에서 onmute 와 onunmute 이벤트를 발생시켜야 합니다.
2. 작업이 어떤 이유로든 완료될 수 없으면(예: 여러 takePhoto() 호출이 연속적으로 발생하는 경우), p를 새로운 DOMException (이름은 UnknownError)로 reject하고, 이후 절차를 중단한다.
3. p를 Blob 객체로 resolve한다.
p를 반환한다.

파라미터	타입	Nullable	Optional	설명
settings	`PhotoSettings`	✔	✘	적용할 `PhotoSettings` 딕셔너리입니다.

getPhotoCapabilities()

getPhotoCapabilities() 는 사용 가능한 설정 옵션의 범위를 조회하는 데 사용됩니다. 이 메서드가 호출되면 User Agent는 다음 절차를 실행해야 합니다:

생성자에 제공된 readyState 가 track 에 대해 live가 아니면, a promise rejected with 새로운 DOMException (이름은 InvalidStateError)을 반환하고, 이후 절차를 중단한다.
p를 새로운 promise로 둔다.
다음 절차를 병렬로 실행한다:
1. track 에서 데이터를 수집하여, 장치가 제공하는 기능(범위 포함)이 담긴 PhotoCapabilities 딕셔너리에 저장한다. 구현 방법은 장치에 따라 다르다.
2. 데이터를 어떤 이유로든 수집할 수 없으면(예: MediaStreamTrack 이 비동기적으로 종료되는 경우), p를 새로운 DOMException (이름은 OperationError)로 reject하고, 이후 절차를 중단한다.
3. p를 PhotoCapabilities 딕셔너리로 resolve한다.
p를 반환한다.

getPhotoSettings()

getPhotoSettings() 는 현재 설정 값을 조회하는 데 사용됩니다. 이 메서드가 호출되면 User Agent는 다음 절차를 실행해야 합니다:

생성자에 제공된 readyState 가 track 에 대해 live가 아니면, a promise rejected with 새로운 DOMException (이름은 InvalidStateError)을 반환하고, 이후 절차를 중단한다.
p를 새로운 promise로 둔다.
다음 절차를 병렬로 실행한다:
1. track 에서 데이터를 수집하여, 장치의 현재 상태를 담은 PhotoSettings 딕셔너리에 저장한다. 구현 방법은 장치에 따라 다르다.
2. 데이터를 어떤 이유로든 수집할 수 없으면(예: MediaStreamTrack 이 비동기적으로 종료되는 경우), p를 새로운 DOMException (이름은 OperationError)로 reject하고, 이후 절차를 중단한다.
3. p를 PhotoSettings 딕셔너리로 resolve한다.
p를 반환한다.

grabFrame()

grabFrame() 는 track에서 유지 중인 실시간 비디오의 스냅샷을 캡처하여, 성공 시 ImageBitmap 을 반환합니다. grabFrame() 는 호출 시 한 번만 데이터를 반환합니다. 이 메서드가 호출되면 User Agent는 다음 절차를 실행해야 합니다:

생성자에 제공된 readyState 가 track 에 대해 live가 아니면, a promise rejected with 새로운 DOMException (이름은 InvalidStateError)을 반환하고, 이후 절차를 중단한다.
p를 새로운 promise로 둔다.
다음 절차를 병렬로 실행한다:
1. track 의 데이터를 ImageBitmap 객체에 담는다. width 와 height 값은 track의 제약에서 유도합니다.
2. 작업이 어떤 이유로든 완료될 수 없으면(예: 여러 grabFrame()/takePhoto() 호출이 연속적으로 발생하는 경우), p를 새로운 DOMException (이름은 UnknownError)로 reject하고, 이후 절차를 중단한다.
3. p를 ImageBitmap 객체로 resolve한다.
p를 반환한다.

4. 사진 기능(PhotoCapabilities)

dictionary PhotoCapabilities {
          RedEyeReduction         redEyeReduction;
          MediaSettingsRange      imageHeight;
          MediaSettingsRange      imageWidth;
          sequence<FillLightMode> fillLightMode;
        };

4.1. 멤버(Members)

redEyeReduction, 타입 RedEyeReduction: 소스의 적목 감소(red eye reduction) 기능.
imageHeight, 타입 MediaSettingsRange: UA가 지원하는 이미지 높이(image height) 범위.
imageWidth, 타입 MediaSettingsRange: UA가 지원하는 이미지 너비(image width) 범위.
fillLightMode, 타입 sequence<FillLightMode>: 지원되는 필라이트 모드(fill light mode)(플래시) 설정.

지원되는 해상도는 imageWidth 및 imageHeight 범위로 분리되어 제공되며, 이는 지문 채취 표면(fingerprinting surface) 증가를 방지하고 UA가 실제 하드웨어 구성에 대해 최선의 결정을 내릴 수 있도록 하기 위함입니다.

5. 사진 설정(PhotoSettings)

dictionary PhotoSettings {
  FillLightMode   fillLightMode;
  double          imageHeight;
  double          imageWidth;
  boolean         redEyeReduction;
};

5.1. 멤버(Members)

redEyeReduction, 타입 boolean: 카메라 적목 감소(red eye reduction)가 필요한지 여부를 나타냅니다.
imageHeight, 타입 double: 원하는 이미지 높이(image height)를 나타냅니다. UA가 이 설정에 대해 이산적인 높이 옵션만 지원하는 경우, 가장 가까운 값을 선택해야 합니다.
imageWidth, 타입 double: 원하는 이미지 너비(image width)를 나타냅니다. UA가 이 설정에 대해 이산적인 너비 옵션만 지원하는 경우, 가장 가까운 값을 선택해야 합니다.
fillLightMode, 타입 FillLightMode: 원하는 필라이트 모드(fill light mode)(플래시) 설정을 나타냅니다.

6. `MediaSettingsRange`

dictionary MediaSettingsRange {
            double max;
            double min;
            double step;
        };

6.1. 멤버(Members)

max, 타입 double: 이 설정의 최대값
min, 타입 double: 이 설정의 최소값
step, 타입 double: 이 설정의 연속 값 사이의 최소 차이.

7. `RedEyeReduction`

enum RedEyeReduction {
          "never",
          "always",
          "controllable"
        };

7.1. 값(Values)

never: 장치에서 적목 감소를 사용할 수 없습니다.
always: 장치에서 적목 감소를 사용할 수 있으며 항상 true로 설정됩니다.
controllable: 장치에서 적목 감소를 사용할 수 있으며, redEyeReduction을 통해 사용자가 제어할 수 있습니다.

8. `FillLightMode`

enum FillLightMode {
          "auto",
          "off",
          "flash"
        };

8.1. 값(Values)

auto: 비디오 장치의 필라이트는 필요할 때(일반적으로 저조도 환경) 활성화됩니다. 그렇지 않으면 꺼집니다. auto는 takePhoto() 호출 시 플래시가 반드시 작동함을 보장하지 않습니다. flash를 사용하면 takePhoto() 메서드에서 플래시가 반드시 작동합니다.
off: 소스의 필라이트 및/또는 플래시는 사용되지 않습니다.
flash: 이 값은 takePhoto() 메서드에서 항상 플래시가 작동하도록 합니다.

9. 확장(Extensions)

이 섹션에서는 MediaStreamTrack의 동작을 사진 촬영에 더 적합하게 만들기 위해 적용할 수 있는 새로운 제약 가능한 속성(constrainable properties) 집합을 정의합니다. 이러한 제약은 MediaStreamTrack의 getCapabilities(), getSettings(), getConstraints() 및 applyConstraints() 메서드를 통해 ImageCapture 객체의 track 동작을 변경할 수 있습니다.

9.1. `MediaTrackSupportedConstraints` 딕셔너리(dictionary)

MediaTrackSupportedConstraints 는 사진 기능을 제어하기 위해 User Agent가 인식하는 제약 목록으로 여기서 확장됩니다. 이 딕셔너리는 MediaDevices 의 getSupportedConstraints() 메서드를 통해 가져올 수 있습니다.

partial dictionary MediaTrackSupportedConstraints {
  boolean whiteBalanceMode = true;
  boolean exposureMode = true;
  boolean focusMode = true;
  boolean pointsOfInterest = true;

  boolean exposureCompensation = true;
  boolean exposureTime = true;
  boolean colorTemperature = true;
  boolean iso = true;

  boolean brightness = true;
  boolean contrast = true;
  boolean pan = true;
  boolean saturation = true;
  boolean sharpness = true;
  boolean focusDistance = true;
  boolean tilt = true;
  boolean zoom = true;
  boolean torch = true;
};

9.1.1. 멤버(Members)

whiteBalanceMode, 타입 boolean, 기본값 true: 화이트 밸런스 모드(white balance mode) 제약이 인식되는지 여부.
colorTemperature, 타입 boolean, 기본값 true: 색온도(color temperature) 제약이 인식되는지 여부.
exposureMode, 타입 boolean, 기본값 true: 노출(exposure) 제약이 인식되는지 여부.
exposureCompensation, 타입 boolean, 기본값 true: 노출 보정(exposure compensation) 제약이 인식되는지 여부.
exposureTime, 타입 boolean, 기본값 true: 노출 시간(exposure time) 제약이 인식되는지 여부.
iso, 타입 boolean, 기본값 true: ISO 제약이 인식되는지 여부.
focusMode, 타입 boolean, 기본값 true: 포커스 모드(focus mode) 제약이 인식되는지 여부.
pointsOfInterest, 타입 boolean, 기본값 true: 관심 지점(points of interest)이 지원되는지 여부.
brightness, 타입 boolean, 기본값 true: 밝기(brightness) 제약이 인식되는지 여부.
contrast, 타입 boolean, 기본값 true: 대비(contrast) 제약이 인식되는지 여부.
pan, 타입 boolean, 기본값 true: 팬(pan) 제약이 인식되는지 여부.
saturation, 타입 boolean, 기본값 true: 채도(saturation) 제약이 인식되는지 여부.
sharpness, 타입 boolean, 기본값 true: 선명도(sharpness) 제약이 인식되는지 여부.
focusDistance, 타입 boolean, 기본값 true: 초점 거리(focus distance) 제약이 인식되는지 여부.
tilt, 타입 boolean, 기본값 true: 틸트(tilt) 제약이 인식되는지 여부.
zoom, 타입 boolean, 기본값 true: 줌(zoom) 레벨의 설정이 인식되는지 여부.
torch, 타입 boolean, 기본값 true: 토치(torch) 설정이 인식되는지 여부.

9.2. `MediaTrackCapabilities` 딕셔너리(dictionary)

MediaTrackCapabilities 는 이미지 캡처에 특화된 기능(capabilities)으로 여기서 확장됩니다. 이 딕셔너리는 UA가 getCapabilities() 를 통해 생성하며, 지원되는 제약의 범위와 열거값을 나타냅니다.

partial dictionary MediaTrackCapabilities {
          sequence<DOMString>  whiteBalanceMode;
          sequence<DOMString>  exposureMode;
          sequence<DOMString>  focusMode;
        
          MediaSettingsRange   exposureCompensation;
          MediaSettingsRange   exposureTime;
          MediaSettingsRange   colorTemperature;
          MediaSettingsRange   iso;
        
          MediaSettingsRange   brightness;
          MediaSettingsRange   contrast;
          MediaSettingsRange   saturation;
          MediaSettingsRange   sharpness;
        
          MediaSettingsRange   focusDistance;
          MediaSettingsRange   pan;
          MediaSettingsRange   tilt;
          MediaSettingsRange   zoom;
        
          sequence<boolean> torch;
        };

9.2.1. 멤버(Members)

whiteBalanceMode, 타입 sequence<DOMString>: 지원되는 화이트 밸런스 모드(white balance modes)의 시퀀스. 각 문자열은 MeteringMode의 멤버 중 하나여야 합니다.
colorTemperature, 타입 MediaSettingsRange: 이 범위는 장면 화이트 밸런스 계산에 사용되는 지원되는 색온도(color temperatures)를 나타냅니다.
exposureMode, 타입 sequence<DOMString>: 지원되는 노출(exposure) 모드의 시퀀스. 각 문자열은 MeteringMode의 멤버여야 합니다.
exposureCompensation, 타입 MediaSettingsRange: 지원되는 노출 보정(exposure compensation) 범위를 나타냅니다. 지원 범위는 일반적으로 0 EV를 중심으로 합니다.
exposureTime, 타입 MediaSettingsRange: 지원되는 노출 시간(exposure time) 범위를 나타냅니다. 값은 숫자이며, 값이 증가할수록 노출 시간이 길어집니다.
iso, 타입 MediaSettingsRange: 허용되는 ISO 값의 범위를 나타냅니다.
focusMode, 타입 sequence<DOMString>: 지원되는 포커스 모드(focus modes)의 시퀀스. 각 문자열은 MeteringMode의 멤버여야 합니다.
brightness, 타입 MediaSettingsRange: 카메라의 밝기(brightness) 설정에 대해 지원되는 범위를 나타냅니다. 값은 숫자이며, 값이 증가할수록 밝기가 증가합니다.
contrast, 타입 MediaSettingsRange: 지원되는 대비(contrast) 범위를 나타냅니다. 값은 숫자이며, 값이 증가할수록 대비가 증가합니다.
pan, 타입 MediaSettingsRange: UA와 트랙이 지원하는 팬(pan) 값의 범위를 나타냅니다.
트랙이 사용 권한 요청(requesting permission to use) 없이 생성되었거나, 해당 권한 요청이 거부된 경우 트랙은 팬(pan)을 지원하지 않습니다. 이 경우 UA는 팬(pan) 값 범위를 노출하지 않아야 하며, 대신 비디오 소스가 팬(pan)을 지원함을 나타내기 위해 빈 MediaSettingsRange 딕셔너리를 제공할 수 있습니다.

UA가 MediaSettingsRange 딕셔너리를 비워서 팬(pan), 틸트(tilt), 줌(zoom) 지원을 표시하더라도, 해당 지원은 getUserMedia() 를 통해 팬/틸트/줌을 지원하는 비디오 트랙을 포함하는 MediaStream 객체를 받아야만 사용할 수 있습니다.
saturation, 타입 MediaSettingsRange: 허용되는 채도(saturation) 설정 범위를 나타냅니다. 값은 숫자이며, 값이 증가할수록 채도가 증가합니다.
sharpness, 타입 MediaSettingsRange: 카메라의 허용되는 선명도(sharpness) 범위를 나타냅니다. 값은 숫자이며, 값이 증가할수록 선명도가 증가합니다. 최소값은 항상 선명도 향상이나 처리 없음임을 의미합니다.
focusDistance, 타입 MediaSettingsRange: UA가 지원하는 초점 거리(focus distance) 값의 범위를 나타냅니다.
tilt, 타입 MediaSettingsRange: UA와 트랙이 지원하는 틸트(tilt) 값의 범위를 나타냅니다.
트랙이 사용 권한 요청 없이 생성되었거나, 해당 권한 요청이 거부된 경우 트랙은 틸트(tilt)를 지원하지 않습니다. 이 경우 UA는 틸트(tilt) 값 범위를 노출하지 않아야 하며, 대신 비디오 소스가 틸트(tilt)를 지원함을 나타내기 위해 빈 MediaSettingsRange 딕셔너리를 제공할 수 있습니다.
zoom, 타입 MediaSettingsRange: UA와 트랙이 지원하는 줌(zoom) 값의 범위를 나타냅니다.
트랙이 사용 권한 요청 없이 생성되었거나, 해당 권한 요청이 거부된 경우 트랙은 줌(zoom)을 지원하지 않습니다. 이 경우 UA는 줌(zoom) 값 범위를 노출하지 않아야 하며, 대신 비디오 소스가 줌(zoom)을 지원함을 나타내기 위해 빈 MediaSettingsRange 딕셔너리를 제공할 수 있습니다.
torch, 타입 sequence<boolean>: 소스가 토치(torch)를 켤 수 없으면 false만 보고합니다. 소스가 토치(torch)를 끌 수 없으면 true만 보고합니다. 스크립트가 해당 기능을 제어할 수 있으면 true와 false 모두를 포함하는 리스트를 보고합니다.

9.3. `MediaTrackConstraintSet` 딕셔너리(dictionary)

MediaTrackConstraintSet [GETUSERMEDIA] 딕셔너리는 getConstraints() 를 통해 현재 상태를 읽거나, applyConstraints() 를 통해 제약을 적용할 때 사용됩니다.

MediaTrackSettings 는 UA가 요청된 MediaTrackConstraints 를 적용한 효과를 확인하기 위해 가져올 수 있습니다. 줌(zoom) 등 일부 제약은 즉시 적용되지 않을 수 있습니다.

partial dictionary MediaTrackConstraintSet {
          ConstrainDOMString           whiteBalanceMode;
          ConstrainDOMString           exposureMode;
          ConstrainDOMString           focusMode;
          ConstrainPoint2D             pointsOfInterest;
        
          ConstrainDouble              exposureCompensation;
          ConstrainDouble              exposureTime;
          ConstrainDouble              colorTemperature;
          ConstrainDouble              iso;
        
          ConstrainDouble              brightness;
          ConstrainDouble              contrast;
          ConstrainDouble              saturation;
          ConstrainDouble              sharpness;
        
          ConstrainDouble              focusDistance;
          (boolean or ConstrainDouble) pan;
          (boolean or ConstrainDouble) tilt;
          (boolean or ConstrainDouble) zoom;
        
          ConstrainBoolean             torch;
        };

9.3.1. 멤버(Members)

whiteBalanceMode, 타입 ConstrainDOMString: 이 문자열은 MeteringMode의 멤버 중 하나여야 합니다. 화이트 밸런스 모드(white balance mode) 제약 속성을 참조하세요.
exposureMode, 타입 ConstrainDOMString: 이 문자열은 MeteringMode의 멤버 중 하나여야 합니다. 노출(exposure) 제약 속성을 참조하세요.
focusMode, 타입 ConstrainDOMString: 이 문자열은 MeteringMode의 멤버 중 하나여야 합니다. 포커스 모드(focus mode) 제약 속성을 참조하세요.
colorTemperature, 타입 ConstrainDouble: 색온도(color temperature) 제약 속성을 참조하세요.
exposureCompensation, 타입 ConstrainDouble: 노출 보정(exposure compensation) 제약 속성을 참조하세요.
exposureTime, 타입 ConstrainDouble: 노출 시간(exposure time) 제약 속성을 참조하세요.
iso, 타입 ConstrainDouble: iso 제약 속성을 참조하세요.
pointsOfInterest, 타입 ConstrainPoint2D: 관심 지점(points of interest) 제약 속성을 참조하세요.
brightness, 타입 ConstrainDouble: 밝기(brightness) 제약 속성을 참조하세요.
contrast, 타입 ConstrainDouble: 대비(contrast) 제약 속성을 참조하세요.
pan, 타입 (boolean or ConstrainDouble): 팬(pan) 제약 속성을 참조하세요.
saturation, 타입 ConstrainDouble: 채도(saturation) 제약 속성을 참조하세요.
sharpness, 타입 ConstrainDouble: 선명도(sharpness) 제약 속성을 참조하세요.
focusDistance, 타입 ConstrainDouble: 초점 거리(focus distance) 제약 속성을 참조하세요.
tilt, 타입 (boolean or ConstrainDouble): 틸트(tilt) 제약 속성을 참조하세요.
zoom, 타입 (boolean or ConstrainDouble): 줌(zoom) 제약 속성을 참조하세요.
torch, 타입 ConstrainBoolean: 토치(torch) 제약 속성을 참조하세요.

9.4. `MediaTrackSettings` 딕셔너리

비디오 스트림 트랙에서 getSettings() 메서드가 호출되면, 사용자 에이전트는 기본 사용자 에이전트의 현재 상태를 나타내는 확장된 MediaTrackSettings 딕셔너리를 반환해야 합니다.

partial dictionary MediaTrackSettings {
  DOMString         whiteBalanceMode;
  DOMString         exposureMode;
  DOMString         focusMode;
  sequence<Point2D> pointsOfInterest;

  double            exposureCompensation;
  double            exposureTime;
  double            colorTemperature;
  double            iso;

  double            brightness;
  double            contrast;
  double            saturation;
  double            sharpness;

  double            focusDistance;
  double            pan;
  double            tilt;
  double            zoom;

  boolean           torch;
};

9.4.1. 멤버

whiteBalanceMode, of type DOMString

현재 화이트 밸런스 모드 설정입니다. 문자열은 MeteringMode의 멤버 중 하나여야 합니다.

exposureMode, of type DOMString

현재 노출 모드 설정입니다. 문자열은 MeteringMode의 멤버 중 하나여야 합니다.

colorTemperature, of type double

화이트 밸런스 계산에 사용되는 컬러 온도입니다. 이 필드는 whiteBalanceMode 가 manual일 때만 유의미합니다.

exposureCompensation, of type double

현재 노출 보정 설정입니다. 0 EV 값은 노출 보정 없음으로 해석됩니다. 이 필드는 exposureMode 가 continuous 또는 single-shot 일 때만 유의합니다.

exposureTime, of type double

현재 노출 시간 설정입니다. 이 필드는 exposureMode 가 manual 일 때만 유의합니다.

iso, of type double

현재 카메라의 ISO 설정입니다.

focusMode, of type DOMString

현재 초점 모드 설정입니다. 문자열은 MeteringMode의 멤버 중 하나여야 합니다.

pointsOfInterest, of type sequence<Point2D>

포커스, 노출, 자동 화이트 밸런스 등 다른 설정에 대한 관심 지점(points of interest)으로 사용되는 Point2D들의 시퀀스입니다.

brightness, of type double

카메라의 현재 밝기 설정을 반영합니다.

contrast, of type double

카메라의 현재 대비 설정을 반영합니다.

pan, of type double

카메라의 현재 pan 설정을 반영합니다.

트랙이 사용 권한 요청(requesting permission to use)을 수행하지 않고(권한 사양 [permissions]에 정의된 대로) PermissionDescriptor의 name 멤버가 camera로 설정되어 있고 그 panTiltZoom 멤버가 true로 설정되어 있지 않거나, 또는 해당 권한 요청이 거부된 경우에는 트랙이 pan을 지원하지 않습니다.

이 경우 UA는 pan 설정을 노출해서는 안됩니다(MUST NOT).

saturation, of type double

카메라의 현재 채도 설정을 반영합니다.

sharpness, of type double

카메라의 현재 선명도 설정을 반영합니다.

focusDistance, of type double

카메라의 현재 초점 거리 설정을 반영합니다.

tilt, of type double

카메라의 현재 tilt 설정을 반영합니다.

트랙이 사용 권한 요청을 수행하지 않았거나(권한 사양 [permissions]에 정의된 대로) PermissionDescriptor의 name 멤버가 camera로 설정되어 있고 panTiltZoom 멤버가 true로 설정되어 있지 않거나, 해당 권한 요청이 거부된 경우에는 트랙이 tilt를 지원하지 않습니다. 그런 경우 UA는 tilt 설정을 노출해서는 안됩니다(MUST NOT).

zoom, of type double

카메라의 현재 줌(zoom) 설정을 반영합니다.

트랙이 사용 권한 요청을 수행하지 않았거나(권한 사양 [permissions]에 정의된 대로) PermissionDescriptor의 name 멤버가 camera로 설정되어 있고 panTiltZoom 멤버가 true로 설정되어 있지 않거나, 해당 권한 요청이 거부된 경우에는 트랙이 zoom을 지원하지 않습니다.

그런 경우 UA는 zoom 설정을 노출해서는 안됩니다(MUST NOT).

torch, of type boolean

현재 카메라의 토치 구성 설정입니다.

9.5. 추가 제약 가능 속성

dictionary ConstrainPoint2DParameters {
  sequence<Point2D> exact;
  sequence<Point2D> ideal;
};

typedef (sequence<Point2D> or ConstrainPoint2DParameters) ConstrainPoint2D;

9.5.1. 멤버

exact, of type sequence<Point2D>: 관심 지점(points of interest)의 정확히 요구되는 값입니다.
ideal, of type sequence<Point2D>: 관심 지점(points of interest)의 이상적(목표) 값입니다.

10. 사진 기능 및 제약 가능한 속성

언급된 많은 사진 및 비디오 기능은 여러 방식으로 구현될 수 있어 정의하기 어렵습니다. 또한 제조업체는 지적 재산권을 보호하기 위해 모호한 정의를 공개하는 경향이 있습니다.

이러한 사진 기능 및 제약 가능한 속성의 이름들은 장치 선택을 위한 허용된 필수 제약 목록에 포함되어 있지 않습니다. 따라서 getUserMedia()에서, 이러한 사진 기능 및 제약 가능한 속성들은 선택적 기본 제약 및 고급 제약으로만 제약할 수 있으며, 필수 제약으로는 제약할 수 없습니다.

화이트 밸런스 모드는 카메라가 서로 다른 색온도에 맞춰 보정하는 데 사용하는 설정입니다. 컬러 온도는 배경광의 온도(보통 켈빈 단위)입니다. 이 설정은 구현에 의해 자동으로 또는 연속적으로 결정되는 경우가 많지만, 장면 조명에 대한 추정 온도를 구현에 힌트로 제공하는 manual 모드를 제공하는 경우도 흔합니다. 널리 사용되는 모드들의 전형적인 온도 범위는 아래에 제시되어 있습니다:

모드	켈빈 범위
incandescent	2500-3500
fluorescent	4000-5000
warm-fluorescent	5000-5500
daylight	5500-6500
cloudy-daylight	6500-8000
twilight	8000-9000
shade	9000-10000

노출은 사진 감광 소자에 입사하도록 허용되는 빛의 양입니다. 자동 노출 모드(single-shot 또는 continuous exposureMode)에서는 장면에 따라 구현이 노출 시간 및/또는 카메라 조리개를 자동으로 조정합니다. manual exposureMode에서는 이러한 매개변수가 고정된 절대값으로 설정됩니다.
초점 모드는 캡처 장치의 초점 설정(e.g. auto 또는 manual)을 설명합니다.
관심 지점은 노출, 화이트 밸런스 모드 및 초점 모드와 같은 다른 설정에서 사용되는 측정 영역의 중심을 설명하며, 각각은 Point2D입니다(일반적으로 이 세 가지 제어는 이른바 3A 알고리즘(auto-focus, auto-exposure, auto-white-balance)에 의해 동시에 수정됩니다).
하나의 Point2D 관심 지점은 정규화된 정사각형 공간에서의 픽셀 위치를 나타내는 것으로 해석됩니다({x,y} ∈ [0.0, 1.0]). 좌표의 원점 {x,y} = {0.0, 0.0}은 왼쪽 위 모서리를, {x,y} = {1.0, 1.0}은 오른쪽 아래 모서리를 나타냅니다: x 좌표(열)는 오른쪽으로 증가하고 y 좌표(행)는 아래로 증가합니다. 언급된 한계를 벗어난 값은 허용 가능한 가장 가까운 값으로 클램프됩니다.
노출 보정은 구현이 사용하는 현재 값으로부터 노출 수준을 조정하는 수치 카메라 설정입니다. 이 값은 자동 노출로 활성화된 노출 수준에 편향을 주는 데 사용될 수 있으며, 보통 0 EV(보정 없음)를 중심으로 대칭적인 범위를 가집니다. 이 값은 single-shot 및 continuous exposureMode에서만 사용됩니다.
노출 시간은 감광 소자에 빛이 허용되는 시간 길이를 제어하는 수치 카메라 설정입니다. 이 값은 manual exposureMode에서 노출을 제어하는 데 사용됩니다. 값의 단위는 100 마이크로초입니다. 즉, 값이 1.0이면 노출 시간은 1/10000초이고 값이 10000.0이면 노출 시간은 1초입니다.
카메라의 ISO 설정은 카메라의 빛에 대한 민감도를 설명합니다. 이는 수치 값이며 값이 낮을수록 민감도가 더 큽니다. 이 값은 [iso12232] 표준을 따라야 합니다.
레드 아이 감소는 플래시에 장시간 노출되어 사진 대상의 홍채가 붉게 보이는 현상("Red Eye")을 제한하거나 방지하도록 설계된 카메라 기능입니다.
[LIGHTING-VOCABULARY] 는 밝기를 "어떤 영역이 더 많거나 적은 빛을 방출하는 것처럼 보이는 시각적 감각의 속성"으로 정의하며, 본 API의 맥락에서는 사진 대상에서 방출되는 빛의 인지된 양을 조정하는 수치 카메라 설정을 의미합니다. 밝기 설정이 높을수록 장면의 어두운 영역의 강도가 증가하고 밝은 부분의 강도는 압축됩니다. 이 설정의 범위와 효과는 구현에 따라 다르지만 일반적으로는 포화 처리를 통해 각 픽셀에 더해지는 수치 값으로 변환됩니다.
대비는 장면의 밝은 영역과 어두운 영역 사이의 밝기 차이를 제어하는 수치 카메라 설정입니다. 대비 설정을 높이면 밝기 차이가 확대됩니다. 이 설정의 범위와 효과는 구현에 따라 다르지만, 일반적으로 화소 값의 변환으로 이해할 수 있으며 히스토그램의 휘도 범위를 더 크게 만드는 변환(때로는 단순한 이득 계수)이 사용됩니다.
[LIGHTING-VOCABULARY] 은 채도를 "밝기에 비례하여 평가되는 영역의 채색도"로 정의하며, 현재 문맥에서는 장면의 색상의 강도(즉 장면의 회색량)를 제어하는 수치 카메라 설정을 의미합니다. 매우 낮은 채도 값은 흑백에 가까운 사진을 생성합니다. 채도는 색상에 대한 대비와 유사하며 구현은 플랫폼에 따라 다르지만, 주어진 이미지의 색차 성분에 적용되는 이득 계수로 이해할 수 있습니다.
선명도는 장면의 에지(경계선) 강도를 제어하는 수치 카메라 설정입니다. 선명도 설정을 높이면 에지 주변의 대비가 커지고, 낮추면 대비가 줄어들어 에지가 더 흐릿해집니다(soft focus). 구현은 플랫폼에 따라 다르지만 원본 이미지에 에지 검출 연산을 적용한 결과와 원본 이미지를 선형 결합하는 방식으로 이해할 수 있으며, 상대 가중치는 이 선명도 설정에 의해 제어됩니다.
밝기, 대비, 채도 및 선명도는 [UVC]에 명시되어 있습니다.
이미지 너비 및 이미지 높이는 센서 보정 및 기타 알고리즘이 적용된 후 생성되는 사진 이미지의 지원/요청된 해상도를 나타냅니다.
지원되는 해상도는 지문 채굴 표면을 늘리지 않고 UA가 실제 하드웨어 구성과 요청된 제약을 고려하여 최선의 결정을 내릴 수 있도록 분리되어 관리됩니다. 예를 들어 imageWidth 및 imageHeight 값/범위가 그러합니다.
초점 거리는 렌즈의 초점 거리를 제어하는 수치 카메라 설정입니다. 이 설정은 보통 최적 초점 거리까지의 미터 단위 거리를 나타냅니다.
팬(Pan)은 카메라의 수평 회전을 제어하는 수치 카메라 설정입니다. 이 설정은 초 단위의 호각(arc seconds)으로 표현되며, 1도는 3600 arc seconds입니다. 값의 범위는 -180*3600 arc seconds부터 +180*3600 arc seconds까지입니다. 양수 값은 위에서 보았을 때 시계 방향으로 팬하고, 음수 값은 위에서 보았을 때 시계 반대 방향으로 팬합니다.
pan에 대한 제약은 팬 기능을 가진 카메라에 대해 fitness distance를 통해 카메라 선택에 영향을 줍니다. 현재 pan 설정을 덮어쓰지 않고 이 영향을 주기 위해 pan을 true로 제약할 수 있습니다. 반대로 false로 제약하면 팬 기능이 있는 카메라에 불이익을 줍니다.

어떤 알고리즘이 MediaTrackConstraintSet 객체를 사용하고 그 pan 딕셔너리 멤버가 false가 아닌 값으로 존재하는 경우, 그 알고리즘은 사용 권한 요청(request permission to use)을 하여(권한 사양 [permissions]에 정의된 대로) PermissionDescriptor의 name 멤버를 camera로 설정하고 panTiltZoom 멤버를 true로 설정하거나, pan 설정을 노출하지 않기로 결정해야 합니다.

만약 최상위 브라우징 컨텍스트의 visibilityState 값이 "hidden"이라면, applyConstraints() 알고리즘은 pan 딕셔너리 멤버가 false가 아닌 값으로 존재하면 SecurityError를 throw해야 합니다.
틸트(Tilt)은 카메라의 수직 회전을 제어하는 수치 카메라 설정입니다. 이 설정은 초 단위의 호각(arc seconds)으로 표현되며 값의 범위는 -180*3600 arc seconds부터 +180*3600 arc seconds까지입니다. 양수 값은 정면에서 보았을 때 카메라를 위로 틸트하고, 음수 값은 정면에서 보았을 때 아래로 틸트합니다.
tilt에 대한 제약은 틸트 기능을 가진 카메라에 대해 fitness distance를 통해 카메라 선택에 영향을 줍니다. 현재 tilt 설정을 덮어쓰지 않고 이 영향을 주기 위해 tilt을 true로 제약할 수 있습니다. 반대로 false로 제약하면 틸트 기능이 있는 카메라에 불이익을 줍니다.

어떤 알고리즘이 MediaTrackConstraintSet 객체를 사용하고 그 tilt 딕셔너리 멤버가 false가 아닌 값으로 존재하는 경우, 그 알고리즘은 사용 권한 요청을 하여(권한 사양 [permissions]에 정의된 대로) PermissionDescriptor의 name 멤버를 camera로 설정하고 panTiltZoom 멤버를 true로 설정하거나, tilt 설정을 노출하지 않기로 결정해야 합니다.

만약 최상위 브라우징 컨텍스트의 visibilityState 값이 "hidden"이라면, applyConstraints() 알고리즘은 tilt 딕셔너리 멤버가 false가 아닌 값으로 존재하면 SecurityError를 throw해야 합니다.

pan 및 tilt를 적용할 때 적용 순서는 정의되어 있지 않으며 UA는 어떤 순서로든 적용할 수 있습니다. 실제로는 이 값들이 절대값이므로 순서가 최종 위치에 영향을 주지 않아야 합니다. 그러나 pan과 tilt 적용이 충분히 느린 경우 적용 순서가 시각적으로 눈에 띌 수 있습니다.
줌(Zoom)은 렌즈의 초점 거리를 제어하는 수치 카메라 설정입니다. 이 설정은 보통 비율을 나타내며 예를 들어 4는 4:1의 줌 비율입니다. 최소값은 보통 1로, 1:1 비율(즉 줌 없음)을 나타냅니다.
zoom에 대한 제약은 줌 기능을 가진 카메라에 대해 fitness distance를 통해 카메라 선택에 영향을 줍니다. 현재 zoom 설정을 덮어쓰지 않고 이 영향을 주기 위해 zoom을 true로 제약할 수 있습니다. 반대로 false로 제약하면 줌 기능이 있는 카메라에 불이익을 줍니다.

어떤 알고리즘이 MediaTrackConstraintSet 객체를 사용하고 그 zoom 딕셔너리 멤버가 false가 아닌 값으로 존재하는 경우, 그 알고리즘은 사용 권한 요청을 하여(권한 사양 [permissions]에 정의된 대로) PermissionDescriptor의 name 멤버를 camera로 설정하고 panTiltZoom 멤버를 true로 설정하거나, zoom 설정을 노출하지 않기로 결정해야 합니다.

만약 최상위 브라우징 컨텍스트의 visibilityState 값이 "hidden"이라면, applyConstraints() 알고리즘은 zoom 딕셔너리 멤버가 false가 아닌 값으로 존재하면 SecurityError를 throw해야 합니다.
보조광 모드 는 캡처 장치의 플래시 설정(e.g. auto, off, on)을 설명합니다. 토치 는 track이 활성화되어 있는 동안 지속적으로 켜져 있는 보조광(continuous fill light)의 설정을 설명합니다.

11. `MeteringMode`

enum MeteringMode {
  "none",
  "manual",
  "single-shot",
  "continuous"
};

11.1. 값(Values)

none: 이 소스는 포커스/노출/화이트 밸런스 모드를 제공하지 않습니다. 설정 시 해당 기능을 끄라는 명령으로 해석됩니다.
manual: 캡처 장치가 렌즈 위치/노출 시간/화이트 밸런스를 수동으로 제어하도록 설정되거나, 해당 모드로 설정이 요청됩니다.
single-shot: 캡처 장치가 단일 스윕 자동 초점/원샷 노출/화이트 밸런스 계산에 맞게 설정되거나, 해당 모드로 설정이 요청됩니다.
continuous: 캡처 장치가 거의 셔터 지연 없는 연속 초점/연속 자동 노출/화이트 밸런스 계산에 맞게 설정되거나, 해당 연속 초점/노출/화이트 밸런스 계산 모드로 설정이 요청됩니다.

12. `Point2D`

Point2D 는 2차원 공간의 위치를 나타냅니다. 좌표의 원점은 공간의 왼쪽 상단 모서리에 위치합니다.

dictionary Point2D {
  double x = 0.0;
  double y = 0.0;
};

12.1. 멤버(Members)

x, 타입 double, 기본값 0.0: 수평(가로, abscissa) 좌표 값.
y, 타입 double, 기본값 0.0: 수직(세로, ordinate) 좌표 값.

13. 예제(Examples)

약간 수정된 버전의 예제들은 이 codepen 컬렉션 등에서 확인할 수 있습니다.

13.1. 카메라 팬, 틸트, 줌 업데이트 및 `takePhoto()`

다음 예제는 이 codepen 등에서도 약간의 수정으로 확인할 수 있습니다.

<html>
<body>
<video autoplay></video>
<img>
<div>
  <input id="pan" title="Pan" type="range" disabled />
  <label for="pan">팬(Pan)</label>
</div>
<div>
  <input id="tilt" title="Tilt" type="range" disabled />
  <label for="tilt">틸트(Tilt)</label>
</div>
<div>
  <input id="zoom" title="Zoom" type="range" disabled />
  <label for="zoom">줌(Zoom)</label>
</div>
<script>
  let imageCapture;

  async function getMedia() {
    try {
      const stream = await navigator.mediaDevices.getUserMedia({
        video: {pan: true, tilt: true, zoom: true},
      });
      const video = document.querySelector('video');
      video.srcObject = stream;

      const [track] = stream.getVideoTracks();
      imageCapture = new ImageCapture(track);

      const capabilities = track.getCapabilities();
      const settings = track.getSettings();

      for (const ptz of ['pan', 'tilt', 'zoom']) {
        // 팬/틸트/줌 사용 가능 여부 확인
        if (!(ptz in settings)) continue;

        // 슬라이더 요소에 매핑
        const input = document.getElementById(ptz);
        input.min = capabilities[ptz].min;
        input.max = capabilities[ptz].max;
        input.step = capabilities[ptz].step;
        input.value = settings[ptz];
        input.disabled = false;
        input.oninput = async event => {
          try {
            // Chrome에서는 advanced constraints 필요
            await track.applyConstraints({[ptz]: input.value});
          } catch (err) {
            console.error("applyConstraints() 실패: ", err);
          }
        };
      }
    } catch (err) {
      console.error(err);
    }
  }

  async function takePhoto() {
    try {
      const blob = await imageCapture.takePhoto();
      console.log("사진 촬영됨: " + blob.type + ", " + blob.size + "B");

      const image = document.querySelector('img');
      image.src = URL.createObjectURL(blob);
    } catch (err) {
      console.error("takePhoto() 실패: ", err);
    }
  }
</script>
</body>
</html>

13.2. `grabFrame()`으로 프레임 반복 획득

다음 예제는 이 codepen 등에서도 약간의 수정으로 확인할 수 있습니다.

<html>
<body>
<canvas></canvas>
<button id="stopButton">프레임 획득 중지</button>
<script>
  async function grabFrames() {
    try {
      const canvas = document.querySelector('canvas');
      const video = document.querySelector('video');

      const stream = await navigator.mediaDevices.getUserMedia({video: true});
      video.srcObject = stream;
      const [track] = stream.getVideoTracks();
      try {
        const imageCapture = new ImageCapture(track);

        stopButton.onclick = () => track.stop();

        while (track.readyState == 'live') {
          const imgData = await imageCapture.grabFrame();
          canvas.width = imgData.width;
          canvas.height = imgData.height;
          canvas.getContext('2d').drawImage(imgData, 0, 0);
          await new Promise(r => setTimeout(r, 1000));
        }
      } finally {
        track.stop();
      }
    } catch (err) {
      console.error(err);
    }
  }
</script>
</body>
</html>

13.3. 프레임 획득 및 후처리(Grabbing a Frame and Post-Processing)

다음 예제는 이 codepen 등에서도 약간의 수정으로 확인할 수 있습니다.

<html>
<body>
<canvas></canvas>
<script>
  async function grabFrames() {
    try {
      const canvas = document.querySelector('canvas');
      const video = document.querySelector('video');

      const stream = await navigator.mediaDevices.getUserMedia({video: true});
      video.srcObject = stream;
      const [track] = stream.getVideoTracks();
      try {
        const imageCapture = new ImageCapture(track);
        const imageBitmap = await imageCapture.grabFrame();

        // |imageBitmap| 픽셀은 직접 접근 불가: 캔버스에 그린 후 getImageData()로 읽어야 함
        const ctx = canvas.getContext('2d');
        canvas.width = imageBitmap.width;
        canvas.height = imageBitmap.height;
        ctx.drawImage(imageBitmap, 0, 0);

        // 캔버스에서 픽셀을 읽고 색상을 반전
        const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);

        const data = imageData.data;
        for (let i = 0; i < data.length; i += 4) {
          data[i] ^= 255;     // red
          data[i + 1] ^= 255; // green
          data[i + 2] ^= 255; // blue
        }
        // 반전된 이미지를 캔버스에 다시 그림
        ctx.putImageData(imageData, 0, 0);
      } finally {
        track.stop();
      }
    } catch (err) {
      console.error(err);
    }
  }
</script>
</body>
</html>

13.4. 카메라 초점 거리 업데이트 및 `takePhoto()`

<html>
<body>
<video autoplay></video>
<img>
<input type="range" hidden>
<script>
  let imageCapture;

  async function getMedia() {
    try {
      const stream = await navigator.mediaDevices.getUserMedia({video: true});
      const video = document.querySelector('video');
      video.srcObject = stream;

      const [track] = stream.getVideoTracks();
      imageCapture = new ImageCapture(track);

      const capabilities = track.getCapabilities();
      const settings = track.getSettings();

      // 초점 거리 사용 가능 여부 확인
      if (!capabilities.focusDistance) {
        return;
      }

      // 초점 거리를 슬라이더 요소에 매핑
      const input = document.querySelector('input[type="range"]');
      input.min = capabilities.focusDistance.min;
      input.max = capabilities.focusDistance.max;
      input.step = capabilities.focusDistance.step;
      input.value = settings.focusDistance;
      input.oninput = async event => {
        try {
          await track.applyConstraints({
            focusMode: "manual",
            focusDistance: input.value
          });
        } catch (err) {
          console.error("applyConstraints() 실패: ", err);
        }
      };
      input.parentElement.hidden = false;
    } catch (err) {
      console.error(err);
    }
  }

  async function takePhoto() {
    try {
      const blob = await imageCapture.takePhoto();
      console.log("사진 촬영됨: " + blob.type + ", " + blob.size + "B");

      const image = document.querySelector('img');
      image.src = URL.createObjectURL(blob);
    } catch (err) {
      console.error("takePhoto() 실패: ", err);
    }
  }
</script>
</body>
</html>

미디어스트림 이미지 캡처

요약

이 문서의 상태

1. 소개

2. 보안 및 개인정보 보호 고려사항

3. 이미지 캡처 API

3.1. 속성

3.2. 메서드

4. 사진 기능(PhotoCapabilities)

4.1. 멤버(Members)

5. 사진 설정(PhotoSettings)

5.1. 멤버(Members)

6. MediaSettingsRange

6.1. 멤버(Members)

7. RedEyeReduction

7.1. 값(Values)

8. FillLightMode

8.1. 값(Values)

9. 확장(Extensions)

9.1. MediaTrackSupportedConstraints 딕셔너리(dictionary)

9.1.1. 멤버(Members)

9.2. MediaTrackCapabilities 딕셔너리(dictionary)

9.2.1. 멤버(Members)

9.3. MediaTrackConstraintSet 딕셔너리(dictionary)

9.3.1. 멤버(Members)

9.4. MediaTrackSettings 딕셔너리

9.4.1. 멤버

9.5. 추가 제약 가능 속성

9.5.1. 멤버

10. 사진 기능 및 제약 가능한 속성

11. MeteringMode

11.1. 값(Values)

12. Point2D

12.1. 멤버(Members)

13. 예제(Examples)

13.1. 카메라 팬, 틸트, 줌 업데이트 및 takePhoto()

13.2. grabFrame()으로 프레임 반복 획득

13.3. 프레임 획득 및 후처리(Grabbing a Frame and Post-Processing)

13.4. 카메라 초점 거리 업데이트 및 takePhoto()

적합성(Conformance)

문서 규약(Document conventions)

적합한 알고리즘(Conformant Algorithms)

색인

이 명세서에서 정의한 용어

참조로 정의된 용어

참고문헌(References)

규범적 참고문헌(Normative References)

비규범적 참고문헌(Informative References)

IDL 색인(IDL Index)

6. `MediaSettingsRange`

7. `RedEyeReduction`

8. `FillLightMode`

9.1. `MediaTrackSupportedConstraints` 딕셔너리(dictionary)

9.2. `MediaTrackCapabilities` 딕셔너리(dictionary)

9.3. `MediaTrackConstraintSet` 딕셔너리(dictionary)

9.4. `MediaTrackSettings` 딕셔너리

11. `MeteringMode`

12. `Point2D`

13.1. 카메라 팬, 틸트, 줌 업데이트 및 `takePhoto()`

13.2. `grabFrame()`으로 프레임 반복 획득

13.4. 카메라 초점 거리 업데이트 및 `takePhoto()`