Description
Utilisez l'API chrome.tabCapture
pour interagir avec les flux multimédias des onglets.
Autorisations
tabCapture
Présentation
L'API chrome.tabCapture vous permet d'accéder à un MediaStream contenant des vidéos et l'audio de l'onglet actuel. Elle ne peut être appelée qu'après que l'utilisateur a appelé une extension, par exemple en cliquant sur le bouton d'action de l'extension. Ce comportement est similaire à celui activeTab.
Conserver l'audio du système
Lorsqu'un MediaStream est obtenu pour un onglet, le son de cet onglet n'est plus lu.
pour l'utilisateur. Ce comportement est semblable à celui de la fonction getDisplayMedia()
lorsque
l'indicateur suppressLocalAudioPlayback
est défini sur "true".
Pour continuer à lire le contenu audio de l'utilisateur, utilisez le code suivant:
const output = new AudioContext();
const source = output.createMediaStreamSource(stream);
source.connect(output.destination);
Cela crée un AudioContext
et connecte l'audio du MediaStream
de l'onglet au titre par défaut
vers votre destination.
ID de flux
L'appel de chrome.tabCapture.getMediaStreamId renvoie un ID de flux. À plus tard accéder à un MediaStream à partir de l'ID, utilisez le code suivant:
navigator.mediaDevices.getUserMedia({
audio: {
mandatory: {
chromeMediaSource: "tab",
chromeMediaSourceId: id,
},
},
video: {
mandatory: {
chromeMediaSource: "tab",
chromeMediaSourceId: id,
},
},
});
Restrictions d'utilisation
Après avoir appelé getMediaStreamId()
, des restrictions s'appliquent à l'emplacement
L'ID de flux renvoyé peut être utilisé:
- Si
consumerTabId
est spécifié, l'ID peut être utilisé par un appelgetUserMedia()
dans n'importe quel frame de la dans un onglet donné, avec la même origine de sécurité. - Si cet élément n'est pas spécifié, à partir de Chrome 116, l'ID peut être utilisé dans n'importe quel cadre comportant le même origine de sécurité dans le même processus de rendu que l'appelant. Cela signifie qu'un ID de flux d'un service worker dans un document hors écran.
Avant Chrome 116, lorsqu'aucun consumerTabId
n'était spécifié, l'ID de flux était limité aux deux
l'origine de sécurité, le processus de rendu et le frame de rendu de l'appelant.
En savoir plus
Pour en savoir plus sur l'utilisation de l'API chrome.tabCapture
, consultez
Enregistrement audio et capture d'écran : Cela montre comment utiliser
tabCapture
et les API associées pour résoudre un certain nombre de cas d'utilisation courants.
Types
CaptureInfo
Propriétés
-
plein écran
booléen
Indique si un élément de l'onglet capturé est en mode plein écran.
-
état
Nouvel état de capture de l'onglet.
-
tabId
Nombre
Identifiant de l'onglet dont l'état a changé.
CaptureOptions
Propriétés
-
audio
Booléen facultatif
-
audioConstraints
MediaStreamConstraint facultatif
-
vidéo
Booléen facultatif
-
videoConstraints
MediaStreamConstraint facultatif
GetMediaStreamOptions
Propriétés
-
consumerTabId
numéro facultatif
ID d'onglet facultatif de l'onglet qui appellera
getUserMedia()
ultérieurement pour utiliser le flux. S'il n'est pas spécifié, le flux obtenu ne peut être utilisé que par l'extension d'appel. Le flux ne peut être utilisé que par les frames de l'onglet donné dont l'origine de sécurité correspond à l'origine de l'onglet de consommation. L'origine de l'onglet doit être sécurisée (par exemple, HTTPS -
targetTabId
numéro facultatif
ID facultatif de l'onglet qui sera capturé. S'il n'est pas spécifié, l'onglet actif actuel est sélectionné. Seuls les onglets pour lesquels l'extension dispose de l'autorisation
activeTab
peuvent être utilisés comme onglet cible.
MediaStreamConstraint
Propriétés
-
obligatoire
objet
-
facultatif
objet facultatif
TabCaptureState
Énumération
"en attente"
"actif"
"arrêté"
"erreur"
Méthodes
capture()
chrome.tabCapture.capture(
options: CaptureOptions,
callback: function,
)
Capture la zone visible de l'onglet actif. La capture ne peut être lancée dans l'onglet actif qu'une fois que l'extension a été appelée, de la même manière qu'activeTab. La capture est conservée lors de la navigation sur les pages dans l'onglet et s'arrête lorsque l'onglet est fermé ou que le flux multimédia est fermé par l'extension.
Paramètres
-
options
Configure le flux multimédia renvoyé.
-
rappel
fonction
Le paramètre
callback
se présente comme suit:(stream: LocalMediaStream) => void
-
flux
LocalMediaStream
-
getCapturedTabs()
chrome.tabCapture.getCapturedTabs(
callback?: function,
)
Renvoie la liste des onglets qui ont demandé une capture ou sont en cours de capture (par exemple, status != arrêté et status != error). Cela permet aux extensions d'informer l'utilisateur qu'une capture d'onglet existante empêche la capture d'un nouvel onglet (ou empêche les requêtes redondantes pour le même onglet).
Paramètres
-
rappel
function facultatif
Le paramètre
callback
se présente comme suit:(result: CaptureInfo[]) => void
-
résultat
-
Renvoie
-
Promise<CaptureInfo[]>
Chrome 116 et versions ultérieuresLes promesses ne sont compatibles qu'avec Manifest V3 et versions ultérieures. Les autres plates-formes doivent utiliser des rappels.
getMediaStreamId()
chrome.tabCapture.getMediaStreamId(
options?: GetMediaStreamOptions,
callback?: function,
)
Crée un ID de flux pour capturer l'onglet cible. Semblable à la méthode chrome.tabCapture.capture(), mais renvoie un ID de flux multimédia (au lieu d'un flux multimédia) dans l'onglet grand public.
Paramètres
-
options
GetMediaStreamOptions facultatif
-
rappel
function facultatif
Le paramètre
callback
se présente comme suit:(streamId: string) => void
-
streamId
chaîne
-
Renvoie
-
Promise<string>
Chrome 116 et versions ultérieuresLes promesses ne sont compatibles qu'avec Manifest V3 et versions ultérieures. Les autres plates-formes doivent utiliser des rappels.
Événements
onStatusChanged
chrome.tabCapture.onStatusChanged.addListener(
callback: function,
)
Événement déclenché lorsque l'état de capture d'un onglet change. Cela permet aux auteurs d'extensions de suivre l'état de capture des onglets et de synchroniser les éléments de l'interface utilisateur tels que les actions sur la page.
Paramètres
-
rappel
fonction
Le paramètre
callback
se présente comme suit:(info: CaptureInfo) => void
-
infos
-