설명
chrome.tabCapture
API를 사용하여 탭 미디어 스트림과 상호작용합니다.
권한
tabCapture
개념 및 사용법
chrome.tabCapture API를 사용하면 동영상 및MediaStream
현재 탭의 오디오입니다. 다음과 같이 사용자가 확장 프로그램을 호출한 후에만 호출할 수 있습니다.
확장 프로그램의 작업 버튼 클릭 이는 Kubernetes의
"activeTab"
권한이 있어야 합니다.
시스템 오디오 보존
특정 탭의 MediaStream
를 획득하면 해당 탭의 오디오가 더 이상 재생되지 않습니다.
표시됩니다. 이는 다음과 같은 경우 getDisplayMedia()
함수의 동작과 유사합니다.
suppressLocalAudioPlayback
플래그가 true로 설정됩니다.
사용자에게 오디오를 계속 재생하려면 다음을 사용하세요.
const output = new AudioContext();
const source = output.createMediaStreamSource(stream);
source.connect(output.destination);
이렇게 하면 새 AudioContext
가 생성되고 탭의 MediaStream
오디오가 기본값에 연결됩니다.
있습니다.
스트림 ID
chrome.tabCapture.getMediaStreamId()
를 호출하면 스트림 ID가 반환됩니다. 나중에
ID에서 MediaStream
에 액세스하려면 다음을 사용합니다.
navigator.mediaDevices.getUserMedia({
audio: {
mandatory: {
chromeMediaSource: "tab",
chromeMediaSourceId: id,
},
},
video: {
mandatory: {
chromeMediaSource: "tab",
chromeMediaSourceId: id,
},
},
});
사용 제한
getMediaStreamId()
를 호출한 후에는
반환된 스트림 ID를 사용할 수 있습니다.
consumerTabId
가 지정되면 ID는 다음 프레임의 모든 프레임에서getUserMedia()
호출에서 사용될 수 있습니다. 특정 탭의 전체 목록을 확인할 수 있습니다- 이 ID를 지정하지 않으면 Chrome 116부터 호출자와 동일한 렌더링 프로세스에서 동일한 보안 출처를 사용합니다. 즉, 스트림 ID를 통해 오프스크린 문서에서 사용할 수 있습니다.
Chrome 116 이전에는 consumerTabId
가 지정되지 않으면 스트림 ID가 둘 다로 제한되었습니다.
호출자의 보안 출처, 렌더링 프로세스 및 렌더링 프레임에 대한 정보를 수집해야 합니다.
자세히 알아보기
chrome.tabCapture
API 사용 방법에 관한 자세한 내용은 다음을 참고하세요.
오디오 녹음 및 화면 캡처 이 데모에서는
tabCapture
및 관련 API를 사용하여 여러 일반적인 사용 사례를 해결합니다.
유형
CaptureInfo
속성
-
전체 화면
부울
캡처 중인 탭의 요소가 전체 화면 모드인지 여부입니다.
-
탭의 새 캡처 상태입니다.
-
tabId
숫자
상태가 변경된 탭의 ID입니다.
CaptureOptions
속성
-
오디오
불리언 선택사항
-
audioConstraints
-
동영상
불리언 선택사항
-
videoConstraints
GetMediaStreamOptions
속성
-
consumerTabId
숫자 선택사항
탭의 탭 ID(선택사항)로, 나중에 스트림을 사용하기 위해
getUserMedia()
를 호출합니다. 지정하지 않으면 호출 확장 프로그램에서만 결과 스트림을 사용할 수 있습니다. 스트림은 보안 출처가 소비자 탭의 출처와 일치하는 특정 탭의 프레임에서만 사용할 수 있습니다. 탭의 출처는 안전한 출처여야 합니다. 예: HTTPS를 사용합니다. -
targetTabId
숫자 선택사항
캡처할 탭의 탭 ID(선택사항)입니다. 지정하지 않으면 현재 활성 탭이 선택됩니다. 확장 프로그램에
activeTab
권한이 부여된 탭만 대상 탭으로 사용할 수 있습니다.
MediaStreamConstraint
속성
-
필수
객체
-
선택사항
객체(선택사항)
TabCaptureState
열거형
'대기 중'
"활성"
"중지됨"
"오류"
메서드
capture()
chrome.tabCapture.capture(
options: CaptureOptions,
callback: function,
)
현재 활성화된 탭의 표시 영역을 캡처합니다. activeTab의 작동 방식과 유사하게 확장 프로그램이 호출된 후에만 현재 활성 탭에서 캡처를 시작할 수 있습니다. 캡처는 탭 내의 페이지 탐색 전반에서 유지 관리되며, 탭이 닫히거나 확장 프로그램에 의해 미디어 스트림이 닫히면 중지됩니다.
매개변수
-
반환된 미디어 스트림을 구성합니다.
-
콜백
함수
callback
매개변수는 다음과 같습니다.(stream: LocalMediaStream) => void
-
스트림
LocalMediaStream
-
getCapturedTabs()
chrome.tabCapture.getCapturedTabs(
callback?: function,
)
캡처를 요청했거나 캡처 중인 탭 목록(예: status != 중지됨 및 상태 != 오류)을 반환합니다. 이를 통해 확장 프로그램은 새 탭 캡처가 성공하지 못하게 하거나 동일한 탭에 대한 중복 요청을 방지하는 기존 탭 캡처가 있다고 사용자에게 알릴 수 있습니다.
매개변수
-
콜백
함수 선택사항
callback
매개변수는 다음과 같습니다.(result: CaptureInfo[]) => void
-
결과
-
반환 값
-
Promise<CaptureInfo[]>
Chrome 116 이상 를 통해 개인정보처리방침을 정의할 수 있습니다.프로미스는 Manifest V3 이상에서 지원되지만 이전 버전과의 호환성입니다. 같은 함수 호출에서 두 가지를 모두 사용할 수는 없습니다. 이 프로미스는 콜백에 전달된 것과 동일한 유형으로 확인됩니다.
getMediaStreamId()
chrome.tabCapture.getMediaStreamId(
options?: GetMediaStreamOptions,
callback?: function,
)
타겟 탭을 캡처하기 위한 스트림 ID를 만듭니다. chrome.tabCapture.capture() 메서드와 유사하지만 미디어 스트림 대신 미디어 스트림 ID를 소비자 탭에 반환합니다.
매개변수
-
옵션
-
콜백
함수 선택사항
callback
매개변수는 다음과 같습니다.(streamId: string) => void
-
streamId
문자열
-
반환 값
-
프로미스<string>
Chrome 116 이상 를 통해 개인정보처리방침을 정의할 수 있습니다.프로미스는 Manifest V3 이상에서 지원되지만 이전 버전과의 호환성입니다. 같은 함수 호출에서 두 가지를 모두 사용할 수는 없습니다. 이 프로미스는 콜백에 전달된 것과 동일한 유형으로 확인됩니다.
이벤트
onStatusChanged
chrome.tabCapture.onStatusChanged.addListener(
callback: function,
)
탭의 캡처 상태가 변경되면 이벤트가 시작됩니다. 이렇게 하면 확장 프로그램 작성자가 탭의 캡처 상태를 추적하여 페이지 작업과 같은 UI 요소의 동기화를 유지할 수 있습니다.
매개변수
-
콜백
함수
callback
매개변수는 다음과 같습니다.(info: CaptureInfo) => void
-
정보
-