Menggunakan WebUSB

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

Ketersediaan dalam 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 dalam pekerja layanan ekstensi. Lihat bagian berikutnya untuk detail lebih lanjut.

Saat API ini digunakan dalam pekerja layanan ekstensi, sesi koneksi perangkat 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 dalam pekerja layanan ekstensi. Untuk mengatasi hal ini, 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 perangkat diperoleh, perangkat akan mengirimkan 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();
    }
  }
});