เหตุการณ์ใน Service Worker

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

ประกาศเหตุการณ์ส่วนขยาย

ตัวแฮนเดิลเหตุการณ์ใน Service Worker จำเป็นต้องประกาศในขอบเขตส่วนกลาง ซึ่งหมายความว่าตัวแฮนเดิลเหตุการณ์ควรอยู่ในระดับบนสุดของสคริปต์และไม่ฝังอยู่ภายในฟังก์ชัน การดำเนินการนี้จะทำให้มั่นใจได้ว่ามีการลงทะเบียนแบบพร้อมกันในการเรียกใช้สคริปต์ครั้งแรก ซึ่งจะทำให้ Chrome ส่งเหตุการณ์ไปยัง Service Worker ได้ทันทีที่เริ่มทำงาน เช่น

ไม่แนะนำ

chrome.storage.local.get(["badgeText"], ({ badgeText }) => {
  chrome.action.setBadgeText({ text: badgeText });
  chrome.action.onClicked.addListener(handleActionClick);
});

ดีกว่า

chrome.action.onClicked.addListener(handleActionClick);

chrome.storage.local.get(["badgeText"], ({ badgeText }) => {
  chrome.action.setBadgeText({ text: badgeText });
});

เหตุการณ์ทั่วไป

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

chrome.action

เริ่มทำงานเพื่อตอบสนองต่อการโต้ตอบของผู้ใช้กับไอคอนแถบเครื่องมือของส่วนขยาย ไม่ว่าการกระทำนั้นจะเป็นหน้าเว็บเฉพาะ (แท็บ) หรือส่วนขยายทั้งหมด

chrome.management

ระบุเหตุการณ์ที่เกี่ยวข้องกับการติดตั้ง การถอนการติดตั้ง การเปิดใช้ และการปิดใช้ส่วนขยาย

chrome.notifications

ระบุเหตุการณ์ที่เกี่ยวข้องกับการโต้ตอบของผู้ใช้กับการแจ้งเตือนของระบบที่ส่วนขยายสร้างขึ้น

chrome.permissions

ระบุว่าผู้ใช้ให้สิทธิ์หรือเพิกถอนสิทธิ์ของส่วนขยายเมื่อใด

chrome.runtime

ระบุเหตุการณ์ที่เกี่ยวข้องกับวงจรส่วนขยาย ข้อความที่ส่งจากส่วนอื่นๆ ของส่วนขยาย และการแจ้งเตือนเกี่ยวกับส่วนขยายหรือการอัปเดต Chrome ที่พร้อมใช้งาน

chrome.storage.onChanged

เริ่มทำงานเมื่อมีการล้างออบเจ็กต์ StorageArea หรือเมื่อมีการเปลี่ยนหรือตั้งค่าค่าของคีย์ โปรดทราบว่าอินสแตนซ์ของ StorageArea แต่ละรายการจะมีเหตุการณ์ onChanged ของตัวเอง

chrome.webNavigation

ให้ข้อมูลเกี่ยวกับสถานะคำขอการนำทางในเที่ยวบิน

ฟิลเตอร์

หากต้องการจำกัดเหตุการณ์ให้ใช้ได้กับ Use Case ที่เจาะจง หรือกำจัดการเรียกเหตุการณ์ที่ไม่จำเป็น ให้ใช้ API ที่รองรับตัวกรองเหตุการณ์ เช่น พิจารณาส่วนขยายที่จะคอยฟังเหตุการณ์ tabs.onUpdated เพื่อตรวจหาเมื่อผู้ใช้ไปที่เว็บไซต์หนึ่งๆ ระบบจะเรียกเหตุการณ์นี้ในทุกการนําทางในทุกแท็บ โปรดใช้ webNavigation.onCompleted กับตัวกรองแทน เช่น

const filter = {
  url: [
    {
      urlMatches: 'https://www.google.com/',
    },
  ],
};

chrome.webNavigation.onCompleted.addListener(() => {
  console.info("The user has loaded my favorite website!");
}, filter);

เหตุการณ์ Web Service Worker

โปรแกรมทำงานของบริการส่วนขยายสนับสนุนเหตุการณ์ในวงจรได้มากกว่าที่อธิบายที่อื่น

ServiceWorkerGlobal.fetch

เริ่มทำงานเมื่อมีการดึงข้อมูลจากแพ็กเกจส่วนขยายหรือเมื่อมีการเรียก fetch() และ XMLHttpRequest() จากส่วนขยายหรือสคริปต์ป๊อปอัป (เครื่องจัดการ fetch ของ Service Worker จะไม่ขัดขวางการโทรจากสคริปต์เนื้อหา) ในกรณีหลัง คุณจะต้องเพิ่ม URL ของหน้าที่ต้องการดึงข้อมูลไปยังคีย์ "host_permissions" ใน manifest.json

ServiceWorkerGlobal.message

การส่งข้อความของโปรแกรมทำงานของบริการพร้อมใช้งานเพิ่มเติมจากการส่งการรับส่งข้อความส่วนขยาย แต่ทั้ง 2 ระบบไม่สามารถทำงานร่วมกัน ซึ่งหมายความว่าข้อความที่ส่งโดยใช้ sendMessage() (ซึ่งมีอยู่ใน API ของส่วนขยายหลายรายการ) จะไม่ดักจับโดยเครื่องจัดการข้อความของโปรแกรมทำงานของบริการ ในทำนองเดียวกัน ตัวแฮนเดิลข้อความส่วนขยายจะไม่ดักจับข้อความที่ส่งโดยใช้ postMessage() ด้วยเช่นกัน โปรแกรมทำงานของบริการส่วนขยายรองรับตัวแฮนเดิลข้อความทั้ง 2 ประเภท ซึ่งหมายถึงทั้ง ServiceWorkerGlobal.message และ chrome.runtime.onMessage

คุณควรเลือกใช้การส่งข้อความส่วนขยาย เว้นแต่คุณจะมีเหตุผลที่เฉพาะเจาะจงในการใช้การรับส่งข้อความของโปรแกรมทำงานของบริการ