Подключение расширения из киоска PWA

После выхода Chrome 102 поддержка приложений Chrome для Windows, Linux и MacOS будет прекращена. Для ChromeOS приложения Chrome будут поддерживаться как минимум до января 2025 года , но мы настоятельно рекомендуем перейти на веб-приложения, поскольку поддержка приложений Chrome запланирована на конец года. Ранее приложения Chrome обладали дополнительной функциональностью в режиме киоска, которая в настоящее время не поддерживается только веб-приложениями. Вы можете продолжать использовать часть этой функциональности, развернув сопутствующее расширение для вашего веб-приложения киоска.

Как развертываются расширения?

Расширения развертываются через консоль администратора Chrome на экране настройки киоска (его можно найти, перейдя по пути Devices > Chrome > Apps & Extensions > Kiosks ). Расширения могут быть размещены либо на общедоступной странице, либо в Chrome Web Store. Для получения дополнительной информации об управлении расширениями в корпоративной или образовательной среде, пожалуйста, обратитесь к этому документу .

Как я могу вызывать API расширений из своего веб-приложения?

Поскольку вы можете развертывать сопутствующие расширения вместе с веб-приложением для киоска, вы можете использовать возможности расширений, вызывая API расширений для выполнения таких задач, как получение полезной информации об устройстве и аппаратной платформе или управление функциями специальных возможностей Chrome.

Если вы будете использовать API, предназначенные только для киосков, вам потребуется включить их в манифесте. Затем реализуйте передачу сообщений между вашим веб-приложением для киосков и сопутствующим расширением, чтобы они могли взаимодействовать друг с другом.

Включить API расширений, доступные только для киосков.

Некоторые API расширений доступны только в режиме киоска. Чтобы ваше расширение могло вызывать эти API, доступные только в режиме киоска, необходимо добавить поле "kiosk_enabled" в манифест и установить для него значение true :

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

Реализовать передачу сообщений

Настройка расширения

Для получения сообщений от вашего веб-приложения и ответа на них вам потребуется запустить фоновый скрипт, который будет прослушивать сообщения, поступающие от клиента (вашего веб-приложения), и затем перенаправлять эти запросы на соответствующий вызов API. В следующем примере запрос на перезапуск устройства ChromeOS перенаправляется, когда веб-приложение отправляет пользовательский объект сообщения, содержащий methodName со значением callRestart .

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

В манифесте расширения можно настроить разрешение внешних вызовов функций расширения с помощью ключа externally_connectable , который указывает, каким сайтам и расширениям разрешено вызывать методы расширения. Более подробную информацию о расширениях Chrome и манифесте версии 3 можно найти в официальной документации .

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

Настройка веб-приложения

Для вызова расширения из веб-приложения необходимо знать его статический идентификатор. Этот идентификатор можно найти на странице chrome://extensions , которая отображается при установке расширения Chrome, или в Chrome Web Store после загрузки расширения. Это позволяет вашему веб-приложению указать точное расширение, с которым оно хочет взаимодействовать. После этого вызовите метод chrome.runtime.sendMessage и передайте в него идентификатор расширения и сообщение, которое вы хотите отправить расширению.

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 его манифеста. Аналогично, веб-приложение должно знать статический идентификатор расширения, с которым оно хочет взаимодействовать.