從資訊站 PWA 連接擴充功能

Windows、Linux 和 macOS 上的 Chrome 102 版之後,Chrome 應用程式將會淘汰。對於 ChromeOS,我們至少會支援 Chrome 應用程式到 2025 年 1 月,但強烈建議您遷移至網頁應用程式,因為 Chrome 應用程式預計將停止支援。先前,Chrome 應用程式在資訊站模式下可使用額外功能,但目前單獨使用網頁應用程式時無法使用。您可以在資訊亭網頁應用程式中部署隨附擴充功能,繼續使用部分功能。

擴充功能如何部署?

擴充功能會透過 Chrome 管理控制台部署在資訊站設定畫面中 (請依序前往 Devices > Chrome > Apps & Extensions > Kiosks)。擴充功能可自行託管在公開可存取的連結,或託管在 Chrome 線上應用程式商店。如要進一步瞭解如何在企業或教育機構環境中管理擴充功能,請參閱這份文件

如何從網頁應用程式呼叫擴充功能 API?

由於您可以透過資訊亭網頁應用程式部署隨附擴充功能,因此可以呼叫 extension API 來運用擴充功能,例如取得裝置和硬體平台的實用資訊,或管理 Chrome 無障礙功能。

如果您要使用僅限 Kiosk 模式的 API,請在資訊清單中啟用這些 API。接著,在 Kiosk 網頁應用程式和隨附擴充功能之間實作訊息傳遞功能,讓兩者可以互相通訊。

啟用僅限資訊站模式的擴充功能 API

部分擴充功能 API 僅適用於資訊站模式。如要讓擴充功能呼叫這些僅限資訊亭模式的 API,請在資訊清單中新增 "kiosk_enabled" 欄位,並將其設為 true

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

實作訊息傳遞

設定擴充功能

如要接收及回覆來自網頁應用程式的訊息,您需要公開背景指令碼,監聽來自用戶端 (網頁應用程式) 的訊息,然後將這些要求 Proxy 至對應的 API 呼叫。在下列範例中,當網頁應用程式傳送包含 methodNamecallRestart 的自訂訊息物件時,系統會將要求代理至 ChromeOS 裝置,以重新啟動裝置。

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

您可以設定擴充功能的資訊清單,透過 externally_connectable 鍵允許外部函式呼叫擴充功能,該鍵會指定允許哪些網站和擴充功能呼叫擴充功能中的方法。如要進一步瞭解 Chrome 擴充功能和資訊清單 V3,請參閱官方說明文件

{
    "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/" ]
      }
 }

設定網頁應用程式

如要從網路應用程式呼叫擴充功能,您必須知道擴充功能的靜態 ID。這個 ID 會顯示在 chrome://extensions頁面,您安裝 Chrome 擴充功能時也會看到,擴充功能上傳後,您也可以在 Chrome 線上應用程式商店中找到這個 ID。這可讓網頁應用程式指定要與哪個擴充功能通訊。接著,請呼叫 chrome.runtime.sendMessage,並傳入擴充功能 ID 和要傳送給擴充功能的訊息。

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');

如要進一步瞭解如何將網頁連結至擴充功能以傳遞訊息,請參閱這份說明文件

注意:擴充功能和網頁應用程式無法任意通訊。擴充功能只會嘗試監聽資訊清單 externally_connectable 區段中列出的網域傳送的訊息。同樣地,網頁應用程式必須知道要與哪個擴充功能通訊,並取得該擴充功能的靜態 ID。