จนถึงตอนนี้ ปี 2023 ยังเป็นปีที่มีการเปลี่ยนแปลงมากมายในโลกของส่วนขยาย Chrome ความคิดเห็นที่มีคุณค่าของคุณช่วยให้เราปรับปรุงแพลตฟอร์มส่วนขยายและเอกสารประกอบได้ นอกจากนี้ เรายังทำงานร่วมกับผู้ให้บริการเบราว์เซอร์รายอื่นๆ ในกลุ่มชุมชน WebExtensions อย่างต่อเนื่อง เพื่อให้ API ของส่วนขยายทำงานได้อย่างสอดคล้องกันมากขึ้นในเบราว์เซอร์ต่างๆ
ในโพสต์นี้ เราจะแชร์การเปลี่ยนแปลงบางอย่างที่ทีมส่วนขยาย Chrome ได้ทำในช่วงครึ่งแรกของปีนี้และฟีเจอร์ที่กำลังจะเปิดตัวในช่วงไตรมาสนี้ มาเริ่มกันเลย
API และฟีเจอร์ใหม่ของส่วนขยาย
ในส่วนนี้ เราต้องการไฮไลต์การเปิดตัว API ที่สำคัญบางรายการ ตรวจสอบการปรับปรุง API อื่นๆ สั้นๆ และแชร์การเปิดตัว API ที่กําลังจะมีขึ้น
ไฮไลต์
เอกสารที่อยู่นอกหน้าจอ
Offscreen API เปิดตัวใน Chrome 109 ซึ่งช่วยให้ส่วนขยาย Manifest V3 จัดการ Use Case ที่ต้องโต้ตอบกับ DOM หรือหน้าต่างได้ ซึ่งดำเนินการใน Service Worker ของส่วนขยายไม่ได้ นอกจากนี้ Chrome 114 ยังมีเหตุผลเพิ่มเติมอีก 2 ประการที่แสดงอยู่นอกหน้าจอ ได้แก่ 'WORKERS'
สำหรับอินสแตนซ์ที่เอกสารของคุณต้องสร้างเวิร์กเกอร์ และ 'LOCAL_STORAGE'
เพื่อช่วยย้ายข้อมูลจาก window.localStorage
ไปยัง chrome.storage
API
ตั้งแต่ Chrome 115 เป็นต้นไป คุณสามารถระบุเหตุผลได้หลายรายการเมื่อสร้างเอกสารนอกหน้าจอ ซึ่งช่วยให้คุณทำงาน 2 อย่างที่เกี่ยวข้องกันในเอกสารเดียวกันได้
Side Panel API ใหม่ 🎉
ก่อนหน้านี้ วิธีสร้างแถบด้านข้างในชิ้นงานมีเพียงวิธีเดียวเท่านั้น นั่นคือ แทรกองค์ประกอบใหม่ด้วยสคริปต์เนื้อหาในทุกหน้า ใน Chrome 114 เราได้เปิดตัว Side Panel API ตอนนี้คุณสามารถพัฒนาประสบการณ์การใช้งานแถบด้านข้างสำหรับผู้ใช้ด้วยวิธีที่ตรงไปตรงมามากขึ้น อ่านเพิ่มเติมเกี่ยวกับวิธีที่ Side Panel API ช่วยให้คุณออกแบบประสบการณ์การใช้งานที่ยอดเยี่ยม
Service Worker ที่มีประสิทธิภาพมากขึ้น
ตอนนี้เหตุการณ์ส่วนขยายทั้งหมดจะรีสตาร์ทตัวจับเวลาช่วงไม่มีการใช้งานของ WOrker บริการส่วนขยาย ใน Chrome 110 เราได้นําขีดจํากัดอายุสูงสุด 5 นาทีออกแล้วสําหรับผู้ดําเนินการบริการส่วนขยาย นอกจากนี้ ข้อความที่ส่งไปยังแอปพลิเคชันเนทีฟและข้อความภายในส่วนขยายจะรีสตาร์ทตัวจับเวลาที่ไม่ได้ใช้งาน อ่านเพิ่มเติมได้ในบทความวงจร Service Worker ของส่วนขยาย
การเปิดตัว API เพิ่มเติม
- Action API: ตั้งแต่ Chrome 110 เป็นต้นไป คุณสามารถปรับแต่งข้อความป้ายได้ด้วย
setBadgeTextColor
() และgetBadgeTextColor()
นอกจากนี้isEnabled()
ยังช่วยให้คุณตรวจสอบได้ว่าเปิดใช้การดำเนินการสำหรับแท็บปัจจุบันหรือไม่ - Commands API: ข้อบกพร่องที่ทางลัดส่วนขยายที่ประกาศในไฟล์ Manifest ในส่วน
"commands._execute_action"
จะหายไประหว่างการเปลี่ยนเป็น MV3 ได้รับการแก้ไขแล้วใน Chrome 111 - Downloads API: UI การดาวน์โหลดเริ่มต้นใน Chrome ได้ย้ายจากชั้นวางที่ด้านล่างไปไว้ทางด้านขวาของแถบค้นหาอเนกประสงค์ หากต้องการปิดใช้ลักษณะการทำงานนี้ ให้ใช้
downloads.setUiOptions()
ซึ่งจะแทนที่setShelfEnabled()
- History API:
chrome.history.getVisits()
และchrome.history.search()
จะแสดงข้อมูลจากอุปกรณ์อื่นๆ ที่ซิงค์กับฐานข้อมูลประวัติการเข้าชมในเครื่องด้วย ซึ่งอาจส่งผลให้มีรายการประวัติการเข้าชมมากขึ้นและจํานวนการเข้าชมสูงขึ้น เพิ่มisLocal
ลงในVisitItem
ใน Chrome 115 (คาดว่าจะพร้อมใช้งานในเวอร์ชันเสถียรภายในเดือนนี้) เพื่อให้กรองตามการเข้าชมในพื้นที่ได้เท่านั้น - Identity API: ตอนนี้หน้าต่างการตรวจสอบสิทธิ์จะปรากฏเป็นป๊อปอัปแทนที่จะกินพื้นที่เต็มหน้าต่างแอปพลิเคชัน เราได้เพิ่มตัวเลือกใหม่ 2 รายการ ได้แก่
abortOnLoadForNonInteractive
และtimeoutMsForNonInteractive
เพื่อให้คุณควบคุมกระบวนการเปลี่ยนเส้นทางด้วย JavaScript ได้มากขึ้น - Storage API: ใน Chrome 112 เราได้เพิ่มขนาดพื้นที่เก็บข้อมูล
chrome.session
เป็น 10 MB จากนั้นมีการเปลี่ยนแปลงขนาดพื้นที่เก็บข้อมูลchrome.local
ให้ตรงกับใน Chrome 114
พบกันเร็วๆ นี้...
Chrome เวอร์ชันที่กำลังจะเปิดตัวจะมีฟีเจอร์มากมายที่จะช่วยให้ส่วนขยายย้ายข้อมูลไปยัง Manifest V3 ได้ง่ายขึ้น ดูรายการการเปลี่ยนแปลงที่เกี่ยวข้องกับการย้ายข้อมูล MV3 ที่กําลังจะเกิดขึ้นได้ที่หน้าปัญหาที่ทราบ นอกจากนี้ เรายังมีแผนที่จะเพิ่มฟีเจอร์ต่อไปนี้
- DeclarativeNetRequest API: ค่าเริ่มต้นสำหรับพร็อพเพอร์ตี้ isUrlFilterCaseSensitive จะเปลี่ยนเป็น
false
ดูชุดข้อความ WECG - File Handling API จะช่วยให้ส่วนขยาย ChromeOS เปิดไฟล์ที่มีประเภท MIME และนามสกุลไฟล์ที่ระบุได้ ขณะนี้ฟีเจอร์นี้อยู่ในระยะทดลอง
- Runtime API: เราจะเปิดตัว
runtime.getContexts()
แทนextension.getViews()
ซึ่งเลิกใช้งานแล้ว ซึ่งจะช่วยให้ส่วนขยายระบุได้ว่าหน้าส่วนขยาย เช่น แผงด้านข้างหรือเอกสารนอกหน้าจอเปิดอยู่หรือไม่ ดูข้อเสนอ WECG - Service Worker: เราจะเพิ่ม Keep-Alive ที่มีประสิทธิภาพไปยัง Chrome API ที่แสดงข้อความแจ้งให้ผู้ใช้ดำเนินการ ดังนี้
permissions.request()
,desktopCapture.chooseDesktopMedia()
,identity.launchWebAuthFlow()
และmanagement.uninstall()
- Side Panel API: เราจะเปิดตัว
sidepanel.open()
ซึ่งจะเปิดแผงด้านข้างของส่วนขยายแบบเป็นโปรแกรมเพื่อตอบสนองต่อท่าทางสัมผัสของผู้ใช้ เช่น การคลิกเมนูบริบท - TabCapture API: เราจะเพิ่มความสามารถในการเรียก
getMediaStreamId()
จาก Service Worker ของส่วนขยายและรับ MediaStream จากรหัสสตรีมในเอกสารที่อยู่นอกหน้าจอ ดูตัวอย่างได้ที่การบันทึกเสียงและการจับภาพหน้าจอ
โปรดติดตามการประกาศเหล่านี้ในหน้ามีอะไรใหม่ในส่วนขยายทันทีที่พร้อมใช้งานใน Chrome เบต้า
การอัปเกรดเอกสารประกอบและคําแนะนําเพิ่มเติมเกี่ยวกับ Manifest V3
นอกจากนี้ เรายังทุ่มเททำงานเพื่อปรับปรุงประสบการณ์การเรียนรู้ของนักพัฒนาแอปด้วย ขอขอบคุณอย่างยิ่งทุกคนที่สละเวลาถามคำถามใน chromium-group และรายงานปัญหาเกี่ยวกับเอกสารประกอบใน developer.chrome.com
ไฮไลต์
- ส่วนการย้ายข้อมูล MV3 ใหม่มีวิธีปฏิบัติจริงในการแปลงส่วนขยาย Manifest V2 เป็น Manifest V3
- คู่มือเจ้าหน้าที่บริการขยายเวลาให้ข้อมูลโดยละเอียดเกี่ยวกับหัวข้อเจ้าหน้าที่บริการขยายเวลา ซึ่งรวมถึงวิธีลงทะเบียนและอัปเดต ลักษณะของวงจรการทำงาน วิธีการนําเข้า และอื่นๆ
- บทแนะนำจัดการเหตุการณ์ด้วย Service Worker จะอธิบายพื้นฐานเกี่ยวกับ Service Worker ของส่วนขยาย ซึ่งจะสร้างส่วนขยายแถบอเนกประสงค์ที่ช่วยให้คุณเข้าถึงหน้าอ้างอิง API ของส่วนขยายได้อย่างรวดเร็ว
ข้อมูลอัปเดตเพิ่มเติม
- การใช้ Google Analytics 4 แสดงวิธีติดตามการใช้งานป๊อปอัปของส่วนขยายและเหตุการณ์ Service Worker
- การใช้ตำแหน่งทางภูมิศาสตร์แสดงวิธีรับตำแหน่งทางภูมิศาสตร์ของส่วนขยายโดยใช้ Offscreen API
- การบันทึกเสียงและการจับภาพหน้าจอจะสอนวิธีจับภาพเสียงและวิดีโอจากแท็บ หน้าต่าง หรือหน้าจอโดยใช้
chrome.tabCapture
และnavigator.mediaDevices.getDisplayMedia()
API - เราได้เพิ่มเคล็ดลับการแก้ไขข้อบกพร่องใหม่ลงในคู่มือการแก้ไขข้อบกพร่องส่วนขยาย
- เราได้ปรับปรุงหลักเกณฑ์เกี่ยวกับคำเตือนสิทธิ์เพื่อให้เข้าใจวิธีการทํางานของคำเตือนสิทธิ์และวิธีที่คุณสามารถมอบประสบการณ์การใช้งานที่ดีขึ้นแก่ผู้ใช้ได้ง่ายขึ้น นอกจากนี้ คุณยังมีวิธีตรวจสอบว่าผู้ใช้จะเห็นคำเตือนใดบ้าง
- ทีมของเราและผู้มีส่วนร่วมยังได้เพิ่มตัวอย่างส่วนขยาย Manifest V3 ใหม่ ได้แก่ WASM ในส่วนขยาย, การสาธิตสคริปต์ API, ตำราสําหรับ Side Panel API และตัวอย่าง DeclarativeNetRequest API คุณดูตัวอย่างส่วนขยายอื่นๆ ได้ในที่เก็บตัวอย่าง GitHub
พบกันเร็วๆ นี้...
- วิธีย้ายข้อมูลโค้ดที่โฮสต์จากระยะไกลไปยัง Manifest V3
- วิธีเรียกใช้การทดสอบอัตโนมัติสำหรับส่วนขยาย Chrome
- ปรับปรุงคําแนะนําเกี่ยวกับคําขอเครือข่ายแบบประกาศ
- การปรับปรุงคำอธิบายสคริปต์เนื้อหา
💡 ทราบหรือไม่
ก่อนจะจบกัน เราขอแชร์เครื่องมือและข้อมูลเชิงลึกที่มีประโยชน์ 2 อย่างดังนี้
- Chrome เริ่มดำเนินการเพื่อรองรับ WebHID แล้ว คุณลองใช้ API ดังกล่าวได้ตั้งแต่ Chrome 115 เป็นต้นไป (แต่โปรดทราบว่า API นี้ยังอยู่ระหว่างการพัฒนา)
- ตอนนี้ Puppeteer รองรับการทดสอบในโหมดไม่มีส่วนหัวโดยใช้
--headless=new
แล้ว อ่านเพิ่มเติมเกี่ยวกับเรื่องนี้ได้ในบล็อกโพสต์การอัปเกรดโหมด headless ของ Chrome - เครื่องมือทดสอบการอัปเดตส่วนขยายช่วยให้คุณตรวจสอบคำเตือนที่แสดงเมื่อสิทธิ์ในไฟล์ Manifest เปลี่ยนแปลงได้ วิธีนี้จะช่วยให้คุณได้รับประสบการณ์การอัปเดตเช่นเดียวกับผู้ใช้ ซึ่งสำคัญเนื่องจากสิทธิ์บางอย่างอาจปิดใช้ส่วนขยายจนกว่าผู้ใช้จะให้สิทธิ์เข้าถึงอีกครั้ง
คุณสนใจพูดคุยกันไหม 🙌
ปีนี้ ทีมส่วนขยายยินดีที่ได้พบนักพัฒนาส่วนขยายด้วยตนเองในงาน Google I/O Connect เรากำลังสร้างพื้นที่ใหม่ๆ เพื่อเชื่อมต่อกับคุณ เช่น การเปิดตัวกลุ่มเป้าหมายและกิจกรรมการพบปะ
ในระหว่างนี้ โปรดถามคำถามใน chromium-groups ต่อ พิจารณาเข้าร่วม WECG และรายงานปัญหาเกี่ยวกับเอกสารประกอบใน ที่เก็บ GitHub ของ developer.chrome.com
ขอขอบคุณอีกครั้งที่ร่วมเป็นส่วนหนึ่งของชุมชนนักพัฒนาส่วนขยาย