Menghubungkan Ekstensi dari PWA Kios

Aplikasi Chrome tidak akan digunakan lagi setelah Chrome 102 untuk Windows, Linux, dan MacOS. Untuk ChromeOS, Aplikasi Chrome akan didukung hingga setidaknya Januari 2025, tetapi sebaiknya Anda bermigrasi ke aplikasi web karena Aplikasi Chrome dijadwalkan untuk dihentikan. Sebelumnya, Aplikasi Chrome memiliki fungsi tambahan yang tersedia dalam mode kios yang saat ini tidak didukung oleh aplikasi web saja. Anda dapat terus menggunakan beberapa fungsi ini dengan men-deploy ekstensi pendamping dengan aplikasi web kios Anda.

Bagaimana cara men-deploy ekstensi?

Ekstensi di-deploy melalui Konsol Admin Chrome di layar konfigurasi kios (ditemukan dengan membuka Devices > Chrome > Apps & Extensions > Kiosks). Ekstensi dapat dihosting sendiri di link yang dapat diakses secara publik atau dengan menghosting ekstensi di Chrome Web Store. Untuk mengetahui informasi selengkapnya tentang cara mengelola ekstensi dalam setelan perusahaan atau pendidikan, lihat dokumen ini.

Bagaimana cara memanggil API ekstensi dari aplikasi web saya?

Karena Anda dapat men-deploy ekstensi pendamping dengan aplikasi web kios, Anda dapat memanfaatkan kemampuan ekstensi dengan memanggil API ekstensi untuk melakukan hal-hal seperti mendapatkan informasi berguna tentang perangkat dan platform hardware atau mengelola fitur aksesibilitas Chrome.

Jika Anda akan menggunakan API khusus kios, Anda harus mengaktifkannya dalam manifes. Kemudian, terapkan penerusan pesan antara aplikasi web kios dan ekstensi pendamping agar keduanya dapat saling berkomunikasi.

Mengaktifkan API ekstensi khusus kios

Ada beberapa API ekstensi yang hanya tersedia dalam mode kios. Agar ekstensi Anda dapat memanggil API khusus kios ini, Anda perlu menambahkan kolom "kiosk_enabled" ke manifes dan menyetelnya ke true:

{
    "manifest_version": 3,
    "version": "1.0",
    ...
    "kiosk_enabled": true
 }

Menerapkan penerusan pesan

Penyiapan ekstensi

Untuk menerima dan merespons pesan dari aplikasi web, Anda harus mengekspos skrip latar belakang yang memproses pesan yang tiba dari klien (aplikasi web Anda), lalu memproksi permintaan tersebut ke panggilan API yang sesuai. Dalam contoh berikut, permintaan di-proxy untuk memulai ulang perangkat ChromeOS saat aplikasi web mengirim objek pesan kustom yang berisi methodName callRestart.

// message handler - extension code
chrome.runtime.onMessageExternal.addListener(function (request, sender, sendResponse) {
  if (request.methodName == 'callRestart') {
    chrome.runtime.restart();
  }
});

Manifes untuk ekstensi dapat dikonfigurasi untuk mengizinkan panggilan fungsi eksternal ke ekstensi melalui kunci externally_connectable yang menentukan situs dan ekstensi mana yang diizinkan untuk memanggil metode di ekstensi. Informasi selengkapnya tentang ekstensi Chrome dan manifes v3 dapat ditemukan di dokumentasi resmi.

{
    "background": {
       "service_worker": "background.js"
    },
    "description": "This restarts your ChromeOS device. Lucky you!",
    "manifest_version": 3,
    "name": "Restart your kiosk app",
    "version": "1.0",
    "kiosk_enabled": true,
    "externally_connectable": {
         "accepts_tls_channel_id": false,
         "matches": [ "://developer.android.com/" ]
      }
 }

Penyiapan aplikasi web

Untuk memanggil ekstensi dari aplikasi web, Anda harus mengetahui ID ekstensi statisnya. ID ini dapat ditemukan di halaman chrome://extensions, ditampilkan saat Anda menginstal ekstensi Chrome, atau dari Chrome Web Store setelah ekstensi diupload. Hal ini memungkinkan aplikasi web Anda menentukan ekstensi persis yang ingin mereka ajak berkomunikasi. Setelah itu, panggil chrome.runtime.sendMessage dan teruskan ID ekstensi dengan pesan yang ingin Anda kirim ke ekstensi.

const STATIC_EXTENSION_ID = 'abcdefghijklmnopqrstuvwxyz'; // found from chrome extensions page of chrome web store.
const callExtensionAPI = function (method) {
  chrome.runtime.sendMessage(STATIC_EXTENSION_ID, {
    methodName: method,
  });
};
callExtensionAPI('callRestart');

Untuk mengetahui informasi selengkapnya tentang menghubungkan halaman web ke ekstensi untuk penerusan pesan, lihat dokumentasi ini.

Catatan: Ekstensi dan aplikasi web tidak dapat berkomunikasi satu sama lain secara acak. Ekstensi hanya akan mencoba memproses pesan dari domain yang tercantum di bagian externally_connectable manifesnya. Demikian pula, aplikasi web harus mengetahui ID statis ekstensi yang ingin diajaknya berkomunikasi.