chrome.tabCapture

refresh date: 2026-09-25 robots: noindex

Deskripsi

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

Izin

tabCapture

Ringkasan

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

Mempertahankan audio sistem

Jika MediaStream diperoleh untuk sebuah tab, audio di tab tersebut tidak akan diputar lagi kepada pengguna. Hal ini mirip dengan perilaku fungsi getDisplayMedia() saat flag suppressLocalAudioPlayback ditetapkan ke 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 Stream

Memanggil chrome.tabCapture.getMediaStreamId akan menampilkan ID streaming. Untuk mengakses MediaStream dari ID di lain waktu, gunakan kode berikut:

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

Batasan penggunaan

Setelah memanggil getMediaStreamId(), ada batasan 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 origin keamanan yang sama.
  • Jika tidak ditentukan, mulai Chrome 116, ID dapat digunakan dalam frame apa pun dengan asal keamanan yang sama dalam proses render yang sama dengan pemanggil. Artinya, ID streaming yang diperoleh di pekerja layanan dapat digunakan dalam dokumen di luar layar.

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

Pelajari lebih lanjut

Untuk mempelajari lebih lanjut cara menggunakan chrome.tabCapture API, lihat Perekaman audio dan perekaman layar. Contoh ini menunjukkan cara menggunakan tabCapture dan API terkait untuk menyelesaikan sejumlah kasus penggunaan umum.

Jenis

CaptureInfo

Properti

  • layar penuh

    boolean

    Apakah elemen di tab yang direkam berada dalam mode layar penuh.

  • Status perekaman baru tab.

  • tabId

    angka

    ID tab yang statusnya berubah.

CaptureOptions

Properti

GetMediaStreamOptions

Chrome 71+

Properti

  • consumerTabId

    number opsional

    ID tab opsional dari tab yang nantinya akan memanggil getUserMedia() untuk menggunakan streaming. Jika tidak ditentukan, aliran data yang dihasilkan hanya dapat digunakan oleh ekstensi yang memanggil. Streaming hanya dapat digunakan oleh frame di tab tertentu yang origin keamanannya cocok dengan origin tab konsumen. Origin tab harus berupa origin yang aman, misalnya HTTPS.

  • targetTabId

    number opsional

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

MediaStreamConstraint

Properti

  • wajib

    objek

  • opsional

    objek opsional

TabCaptureState

Enum

"pending"

"active"

"stopped"

"error"

Metode

capture()

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

Mengambil area yang terlihat dari tab yang saat ini aktif. Perekaman hanya dapat dimulai pada tab yang saat ini aktif setelah ekstensi dipanggil, mirip dengan cara kerja activeTab. Perekaman 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,
): Promise<CaptureInfo[]>

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 perekaman tab yang sedang berlangsung yang akan mencegah perekaman tab baru berhasil (atau untuk mencegah permintaan berulang untuk tab yang sama).

Parameter

  • callback

    fungsi opsional

    Parameter callback terlihat seperti: 

    (result: CaptureInfo[]) => void

Hasil

  • Promise<CaptureInfo[]>

    Chrome 116+

    Menampilkan Promise yang di-resolve dengan CaptureInfo[] untuk tab yang diambil.

    Promise hanya didukung untuk Manifes V3 dan yang lebih baru, platform lain harus menggunakan callback.

getMediaStreamId()

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

Membuat ID streaming untuk merekam tab target. Serupa 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+

    Menampilkan Promise yang di-resolve dengan hasilnya. Jika berhasil, hasilnya adalah string buram yang dapat diteruskan ke getUserMedia() API untuk menghasilkan streaming media yang sesuai dengan tab target. streamId yang dibuat hanya dapat digunakan sekali dan akan habis masa berlakunya setelah beberapa detik jika tidak digunakan.

    Promise hanya didukung untuk Manifes V3 dan yang lebih baru, platform lain harus menggunakan callback.

Acara

onStatusChanged

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

Peristiwa diaktifkan saat status perekaman tab berubah. Hal ini memungkinkan pembuat ekstensi melacak status perekaman tab untuk menjaga elemen UI seperti tindakan halaman tetap sinkron.

Parameter