Menggunakan WebUSB

WebUSB API mengekspos perangkat yang kompatibel dengan Universal Serial Bus (USB) non-standar ke web. Halaman ini menjelaskan aspek API yang khusus untuk ekstensi. Lihat MDN untuk mengetahui detail lengkap WebUSB API.

Ketersediaan di ekstensi

Chrome 118 atau yang lebih baru.

Izin

Tidak ada izin file manifes yang diperlukan; namun WebUSB memicu alur izin pengguna browser.

Manifes

Tidak ada kunci manifes yang diperlukan untuk API ini.

Konteks pendukung

API ini dapat digunakan di hampir semua konteks; Metode WebUSB.requestDevice() tidak dapat digunakan di pekerja layanan ekstensi. Lihat bagian berikutnya untuk detail lebih lanjut.

Saat API ini digunakan di pekerja layanan ekstensi, sesi koneksi perangkat akan membuat pekerja layanan tetap aktif.

Perbedaan ekstensi Chrome

Meskipun WebUSB tersedia untuk pekerja layanan ekstensi, WebUSB.requestDevice(), yang menampilkan promise yang di-resolve dengan instance USBDevice, tidak dapat dipanggil di pekerja layanan ekstensi. Untuk menyiasatinya, panggil requestDevice() dari halaman ekstensi selain pekerja layanan ekstensi dan kirim pesan ke pekerja layanan ekstensi.

Kode berikut mengikuti pola umum dengan memanggil requestDevice() sebagai bagian dari alur izin yang memerlukan gestur pengguna. Saat diperoleh, perangkat akan mengirim pesan ke pekerja layanan, yang kemudian dapat mengambil perangkat menggunakan getDevices().

popup.js:

myButton.addEventListener("click", async () => {
  await navigator.usb.requestDevice({
    filters: [{ vendorId: 0x1234, productId: 0x5678 }],
  });
  chrome.runtime.sendMessage("newDevice");
});

service-worker.js

chrome.runtime.onMessage.addListener(async (message) => {
  if (message === "newDevice") {
    const devices = await navigator.usb.getDevices();
    for (const device of devices) {
      // open device connection.
      await device.open();
    }
  }
});