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

ผู้ให้บริการส่วนขยายรองรับทั้งเหตุการณ์ Service Worker มาตรฐานและเหตุการณ์หลายรายการใน Extension 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

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

คุณควรใช้การรับส่งข้อความของเวิร์กชีต เว้นแต่จะมีเหตุผลเฉพาะในการใช้การรับส่งข้อความของ Service Worker