การเชื่อมต่อส่วนขยายจาก PWA ของคีออสก์

แอป Chrome จะเลิกใช้งานหลังจาก Chrome 102 สำหรับ Windows, Linux และ MacOS สำหรับ ChromeOS เราจะรองรับแอป Chrome จนถึงเดือนมกราคม 2025 เป็นอย่างน้อย แต่ขอแนะนำอย่างยิ่งให้ย้ายข้อมูลไปยังเว็บแอปเนื่องจากเรามีกำหนดการเลิกใช้งานแอป Chrome ก่อนหน้านี้ Chrome Apps มีฟังก์ชันการทำงานเพิ่มเติมในโหมดคีออสก์ซึ่งปัจจุบันเว็บแอปเพียงอย่างเดียวไม่รองรับ คุณยังคงใช้ฟังก์ชันบางอย่างนี้ได้โดยการติดตั้งใช้งานส่วนขยายที่มาพร้อมกันกับเว็บแอปพลิเคชันคีออสก์

มีการติดตั้งใช้งานส่วนขยายอย่างไร

ระบบจะติดตั้งใช้งานส่วนขยายผ่านคอนโซลผู้ดูแลระบบ Chrome ในหน้าจอการกำหนดค่าคีออสก์ (ดูได้โดยไปที่ Devices > Chrome > Apps & Extensions > Kiosks) ส่วนขยายอาจโฮสต์ด้วยตนเองที่ลิงก์ที่เข้าถึงได้แบบสาธารณะหรือโดยการโฮสต์ส่วนขยายใน Chrome เว็บสโตร์ ดูข้อมูลเพิ่มเติมเกี่ยวกับการจัดการส่วนขยายในการตั้งค่าองค์กรหรือการศึกษาได้ที่เอกสารนี้

ฉันจะเรียกใช้ API ของส่วนขยายจากเว็บแอปได้อย่างไร

เนื่องจากคุณสามารถติดตั้งใช้งานส่วนขยายที่มาพร้อมกันกับเว็บแอปคีออสก์ได้ คุณจึงใช้ประโยชน์จากความสามารถของส่วนขยายได้โดยการเรียก API ของส่วนขยายเพื่อทำสิ่งต่างๆ เช่น รับข้อมูลที่เป็นประโยชน์เกี่ยวกับอุปกรณ์และแพลตฟอร์มฮาร์ดแวร์ หรือจัดการฟีเจอร์การช่วยเหลือพิเศษของ Chrome

หากจะใช้ API สำหรับคีออสก์เท่านั้น คุณจะต้องเปิดใช้ API เหล่านั้นในไฟล์ Manifest จากนั้นใช้การส่งข้อความระหว่างเว็บแอปคีออสก์กับส่วนขยายคู่กันเพื่อให้สื่อสารกันได้

เปิดใช้ API ของส่วนขยายสำหรับคีออสก์เท่านั้น

มี API ของส่วนขยายบางอย่างที่ใช้ได้ในโหมดคีออสก์เท่านั้น หากต้องการให้ส่วนขยายเรียกใช้ API ที่ใช้ได้เฉพาะในคีออสก์ คุณต้องเพิ่มฟิลด์ "kiosk_enabled" ลงในไฟล์ Manifest และตั้งค่าเป็น 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();
  }
});

คุณกำหนดค่าไฟล์ Manifest ของส่วนขยายเพื่ออนุญาตการเรียกฟังก์ชันภายนอกไปยังส่วนขยายผ่านคีย์ externally_connectable ได้ ซึ่งจะระบุเว็บไซต์และส่วนขยายที่ได้รับอนุญาตให้เรียกใช้เมธอดในส่วนขยาย ดูข้อมูลเพิ่มเติมเกี่ยวกับส่วนขยาย Chrome และ Manifest 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/" ]
      }
 }

การตั้งค่าเว็บแอป

หากต้องการเรียกใช้ส่วนขยายจากเว็บแอป คุณต้องทราบรหัสส่วนขยายแบบคงที่ คุณดูรหัสนี้ได้ในchrome://extensionsหน้าเว็บที่แสดงเมื่อติดตั้งส่วนขยาย Chrome หรือจาก Chrome เว็บสโตร์หลังจากอัปโหลดส่วนขยายแล้ว ซึ่งจะช่วยให้เว็บแอปของคุณระบุส่วนขยายที่ต้องการสื่อสารได้อย่างแม่นยำ หลังจากนั้น ให้เรียกใช้ 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 ของไฟล์ Manifest เท่านั้น ในทำนองเดียวกัน เว็บแอปต้องทราบรหัสแบบคงที่ของส่วนขยายที่ต้องการสื่อสารด้วย