chrome.tabCapture

Deskripsi

Menggunakan chrome.tabCapture API untuk berinteraksi dengan streaming media tab.

Izin

tabCapture

Konsep dan penggunaan

Dengan chrome.tabCapture API, Anda dapat mengakses MediaStream yang berisi video dan audio dari tab saat ini. Ekstensi hanya dapat dipanggil setelah pengguna memanggil ekstensi, misalnya dengan mengklik tombol tindakan ekstensi. Hal ini mirip dengan perilaku izin "activeTab".

Pertahankan audio sistem

Saat MediaStream diperoleh untuk tab, audio di tab tersebut tidak akan lagi diputar bagi pengguna. Hal ini mirip dengan perilaku fungsi getDisplayMedia() saat tanda suppressLocalAudioPlayback ditetapkan ke benar (true).

Untuk terus memutar audio kepada pengguna, gunakan hal berikut:

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

Tindakan ini akan membuat AudioContext baru dan menghubungkan audio MediaStream tab ke tujuan default.

ID aliran data

Memanggil chrome.tabCapture.getMediaStreamId() akan menampilkan ID aliran data. Untuk mengakses MediaStream dari ID nanti, gunakan hal berikut:

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

Batasan penggunaan

Setelah memanggil getMediaStreamId(), ada pembatasan terkait tempat ID streaming yang ditampilkan dapat digunakan:

  • Jika consumerTabId ditentukan, ID dapat digunakan oleh panggilan getUserMedia() di frame mana pun dalam tab tertentu yang memiliki asal keamanan yang sama.
  • Jika hal ini tidak ditentukan, mulai Chrome 116, ID dapat digunakan di frame mana pun dengan asal keamanan yang sama dalam proses render yang sama dengan pemanggil. Ini berarti ID streaming yang diperoleh dalam pekerja layanan dapat digunakan dalam dokumen di luar layar.

Sebelum Chrome 116, jika consumerTabId tidak ditentukan, ID streaming dibatasi untuk asal keamanan, proses render, dan frame render pemanggil.

Selengkapnya

Untuk mempelajari lebih lanjut cara menggunakan chrome.tabCapture API, lihat Rekaman audio dan screenshot. Hal ini menunjukkan cara menggunakan tabCapture dan API terkait untuk menyelesaikan sejumlah kasus penggunaan umum.

Jenis

CaptureInfo

Properti

  • layar penuh

    boolean

    Apakah elemen dalam tab yang ditangkap berada dalam mode layar penuh.

  • Status pengambilan baru tab.

  • tabId

    angka

    ID tab yang statusnya berubah.

CaptureOptions

Properti

GetMediaStreamOptions

Chrome 71 dan yang lebih baru

Properti

  • consumerTabId

    nomor opsional

    ID tab opsional dari tab yang nantinya akan memanggil getUserMedia() untuk menggunakan streaming. Jika tidak ditentukan, streaming yang dihasilkan hanya dapat digunakan oleh ekstensi panggilan. Streaming hanya dapat digunakan oleh frame dalam tab tertentu yang asal keamanannya cocok dengan asal tab sumber konsumber. Asal tab harus berupa asal yang aman, misalnya, HTTPS.

  • targetTabId

    nomor opsional

    ID tab opsional dari tab yang akan diambil. Jika tidak ditentukan, tab yang aktif saat ini akan dipilih. Hanya tab yang telah diberi izin activeTab yang dapat digunakan sebagai tab target.

MediaStreamConstraint

Properti

  • wajib

    objek

  • opsional

    objek opsional

TabCaptureState

Enum

"error"

Metode

capture()

Hanya latar depan 
chrome.tabCapture.capture(
  options: CaptureOptions,
  callback: function,
)

Menangkap area yang terlihat di tab yang sedang aktif. Pengambilan hanya dapat dimulai pada tab yang saat ini aktif setelah ekstensi dipanggil, mirip dengan cara kerja activeTab. Pengambilan gambar dipertahankan di seluruh navigasi halaman dalam tab, dan berhenti saat tab ditutup, atau streaming media ditutup oleh ekstensi.

Parameter

  • Mengonfigurasi streaming media yang ditampilkan.

  • callback

    fungsi

    Parameter callback terlihat seperti: 

    (stream: LocalMediaStream)=>void

    • feed

      LocalMediaStream

getCapturedTabs()

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

Menampilkan daftar tab yang telah meminta perekaman atau sedang direkam, yaitu status != dihentikan dan status != error. Hal ini memungkinkan ekstensi memberi tahu pengguna bahwa ada rekaman tab yang akan mencegah pengambilan tab baru berhasil (atau untuk mencegah permintaan yang berlebihan untuk tab yang sama).

Parameter

  • callback

    fungsi opsional

    Parameter callback terlihat seperti: 

    (result: CaptureInfo[])=>void

Hasil

  • Promise<CaptureInfo[]>

    Chrome 116 dan yang lebih baru

    Promise didukung di Manifes V3 dan yang lebih baru, tetapi callback disediakan untuk kompatibilitas mundur. Anda tidak dapat menggunakan keduanya pada panggilan fungsi yang sama. Promise di-resolve dengan jenis yang sama yang diteruskan ke callback.

getMediaStreamId()

Promise Chrome 71+ 
chrome.tabCapture.getMediaStreamId(
  options?: GetMediaStreamOptions,
  callback?: function,
)

Membuat ID streaming untuk merekam tab target. Mirip dengan metode chrome.tabCapture.capture(), tetapi menampilkan ID streaming media, bukan streaming media, ke tab konsumen.

Parameter

  • opsi

    GetMediaStreamOptions opsional

  • callback

    fungsi opsional

    Parameter callback terlihat seperti: 

    (streamId: string)=>void

    • streamId

      string

Hasil

  • Promise<string>

    Chrome 116 dan yang lebih baru

    Promise didukung di Manifes V3 dan yang lebih baru, tetapi callback disediakan untuk kompatibilitas mundur. Anda tidak dapat menggunakan keduanya pada panggilan fungsi yang sama. Promise di-resolve dengan jenis yang sama yang diteruskan ke callback.

Peristiwa

onStatusChanged

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

Peristiwa diaktifkan saat status tangkapan tab berubah. Hal ini memungkinkan penulis ekstensi melacak status tangkapan tab untuk menjaga sinkronisasi elemen UI seperti tindakan halaman.

Parameter