chrome.tabCapture

Descripción

Usa la API de chrome.tabCapture para interactuar con las transmisiones de contenido multimedia de las pestañas.

Permisos

tabCapture

Conceptos y uso

La API de chrome.tabCapture te permite acceder a una MediaStream que contiene videos y el audio de la pestaña actual. Solo se lo puede llamar después de que el usuario invoque una extensión, por ejemplo, con si haces clic en el botón de acción de la extensión. Esto es similar al comportamiento de la "activeTab".

Conservar el audio del sistema

Cuando se obtiene un MediaStream para una pestaña, ya no se reproduce el audio de esa pestaña. para el usuario. Esto es similar al comportamiento de la función getDisplayMedia() cuando la marca suppressLocalAudioPlayback se establece en verdadero.

Para seguir reproduciendo audio para el usuario, usa lo siguiente:

const output = new AudioContext();
const source = output.createMediaStreamSource(stream);
source.connect(output.destination);

Esto creará un AudioContext nuevo y conectará el audio del MediaStream de la pestaña al valor predeterminado. destino.

IDs de transmisión

Si llamas a chrome.tabCapture.getMediaStreamId(), se mostrará un ID de transmisión. Hasta más tarde accede a una MediaStream desde el ID, usa lo siguiente:

navigator.mediaDevices.getUserMedia({
  audio: {
    mandatory: {
      chromeMediaSource: "tab",
      chromeMediaSourceId: id,
    },
  },
  video: {
    mandatory: {
      chromeMediaSource: "tab",
      chromeMediaSourceId: id,
    },
  },
});

Restricciones de uso

Después de llamar a getMediaStreamId(), existen restricciones sobre dónde se llama el ID de transmisión devuelto se puede usar:

  • Si se especifica consumerTabId, una llamada a getUserMedia() puede usar el ID en cualquier fotograma del esa pestaña, que tiene el mismo origen de seguridad.
  • Si no se especifica, a partir de Chrome 116, el ID se puede usar en cualquier marco con el mismo origen de seguridad en el mismo proceso de renderización que el emisor. Esto significa que un ID de transmisión obtenido en un service worker se puede usar en un documento fuera de pantalla.

Antes de Chrome 116, cuando no se especificaba un consumerTabId, el ID de transmisión se restringía a ambos como el origen de seguridad, el proceso de renderización y el marco de renderización del emisor.

Más información

Para obtener más información sobre cómo usar la API de chrome.tabCapture, consulta Grabación de audio y captura de pantalla: Esto demuestra cómo usar tabCapture y las APIs relacionadas para resolver varios casos de uso comunes.

Tipos

CaptureInfo

Propiedades

  • pantalla completa

    boolean

    Indica si un elemento de la pestaña que se está capturando está en modo de pantalla completa.

  • El nuevo estado de captura de la pestaña.

  • tabId

    número

    El ID de la pestaña cuyo estado cambió.

CaptureOptions

Propiedades

GetMediaStreamOptions

Chrome 71 y versiones posteriores

Propiedades

  • consumerTabId

    número opcional

    Es el ID de pestaña opcional de la pestaña que más adelante invocará a getUserMedia() para consumir la transmisión. Si no se especifica, solo la extensión que realiza la llamada puede usar la transmisión resultante. Solo pueden usar la transmisión los fotogramas de la pestaña correspondiente cuyo origen de seguridad coincida con el de la pestaña de navegación. El origen de la pestaña debe ser un origen seguro, p.ej., HTTPS

  • targetTabId

    número opcional

    ID de pestaña opcional de la pestaña que se capturará. Si no se especifica, se seleccionará la pestaña activa actual. Solo se pueden usar como pestañas de destino las pestañas para las que se otorgó el permiso activeTab a la extensión.

MediaStreamConstraint

Propiedades

  • obligatorio

    objeto

  • opcional

    objeto opcional

TabCaptureState

Enum

“pendiente”

“activo”

“detenido”

“error”

Métodos

capture()

Solo en primer plano 
chrome.tabCapture.capture(
  options: CaptureOptions,
  callback: function,
)

Captura el área visible de la pestaña activa en ese momento. La captura solo se puede iniciar en la pestaña que está activa después de que se haya invocado la extensión, de manera similar a como funciona activeTab. La captura se mantiene en todas las navegaciones de páginas dentro de la pestaña y se detiene cuando esta se cierra o la extensión cierra la transmisión de contenido multimedia.

Parámetros

  • opciones

    CaptureOptions

    Configura la transmisión de contenido multimedia que se muestra.

  • callback

    función

    El parámetro callback se ve de la siguiente manera: 

    (stream: LocalMediaStream) => void

    • transmisión

      LocalMediaStream

getCapturedTabs()

Promesa 
chrome.tabCapture.getCapturedTabs(
  callback?: function,
)

Muestra una lista de las pestañas que solicitaron la captura o que se están capturando, es decir, status != stopped y status != error. Esto permite que las extensiones informen al usuario que hay una captura de pestaña existente que evitaría que la captura de una pestaña nueva se realice correctamente (o evitar solicitudes redundantes para la misma pestaña).

Parámetros

  • callback

    función opcional

    El parámetro callback se ve de la siguiente manera: 

    (result: CaptureInfo[]) => void

Muestra

  • Promise<CaptureInfo[]>

    Chrome 116 y versiones posteriores

    Las promesas son compatibles con Manifest V3 y versiones posteriores, pero se proporcionan devoluciones de llamada para retrocompatibilidad. No puedes usar ambos en la misma llamada a función. El se resuelve con el mismo tipo que se pasa a la devolución de llamada.

getMediaStreamId()

Promesa Chrome 71 y versiones posteriores .
chrome.tabCapture.getMediaStreamId(
  options?: GetMediaStreamOptions,
  callback?: function,
)

Crea un ID de transmisión para capturar la pestaña de destino. Es similar al método chrome.tabCapture.capture(), pero muestra un ID de transmisión multimedia en la pestaña del consumidor, en lugar de una transmisión multimedia.

Parámetros

  • opciones

    GetMediaStreamOptions opcional

  • callback

    función opcional

    El parámetro callback se ve de la siguiente manera: 

    (streamId: string) => void

    • streamId

      string

Muestra

  • Promesa<string>

    Chrome 116 y versiones posteriores

    Las promesas son compatibles con Manifest V3 y versiones posteriores, pero se proporcionan devoluciones de llamada para retrocompatibilidad. No puedes usar ambos en la misma llamada a función. El se resuelve con el mismo tipo que se pasa a la devolución de llamada.

Eventos

onStatusChanged

chrome.tabCapture.onStatusChanged.addListener(
  callback: function,
)

El evento se activa cuando cambia el estado de captura de una pestaña. Esto permite a los autores de las extensiones hacer un seguimiento del estado de captura de las pestañas para mantener sincronizados los elementos de la IU, como las acciones de la página.

Parámetros

  • callback

    función

    El parámetro callback se ve de la siguiente manera: 

    (info: CaptureInfo) => void