עדכונים שלא קשורים לבעיות אחרות
זהו הקטע הראשון מתוך שלושה שמתארים את השינויים הנדרשים בקוד שאינו חלק מ-service worker של התוסף. הקטע הזה מיועד לשינויים נדרשים בקוד שלא קשורים לבעיות אחרות. בשני הקטעים הבאים נסביר על החלפת בקשות אינטרנט חסומים ועל שיפור האבטחה.
החלפת ה-Tab.executeScript() ב-scripting.executeScript()
במניפסט מגרסה V3, executeScript()
עובר מה-API של tabs
ל-API של scripting
. לשם כך, צריך לשנות את ההרשאות בקובץ המניפסט בנוסף לשינויים בקוד בפועל.
כדי להשתמש בשיטה executeScript()
, צריך:
- ההרשאה
"scripting"
. - הרשאות המארח או ההרשאה
"activeTab"
.
השיטה scripting.executeScript()
דומה לאופן הפעולה שלה עם tabs.executeScript()
. יש כמה הבדלים.
- בשיטה הישנה אפשר להשתמש רק בקובץ אחד, אבל בשיטה החדשה אפשר להשתמש במערך של קבצים.
- בנוסף, מעבירים אובייקט מסוג
ScriptInjection
במקוםInjectDetails
. יש כמה הבדלים בין השניים. לדוגמה,tabId
מועבר עכשיו כחבר בקבוצהScriptInjection.target
במקום כארגומנט method.
בדוגמה אפשר לראות איך לעשות את זה.
async function getCurrentTab() {/* ... */} let tab = await getCurrentTab(); chrome.tabs.executeScript( tab.id, { file: 'content-script.js' } );
בקובץ סקריפט ברקע.
async function getCurrentTab() let tab = await getCurrentTab(); chrome.scripting.executeScript({ target: {tabId: tab.id}, files: ['content-script.js'] });
בקובץ השירות (service worker).
מחליפים את tabs.insertCSS() ו-tabs.removeCSS() ב-scripting.insertCSS() וב-scripting.removeCSS()
במניפסט V3, הערכים insertCSS()
ו-removeCSS()
עוברים מ-tabs
API ל-scripting
API. לשם כך נדרשים שינויים בהרשאות בקובץ המניפסט, בנוסף לשינויים בקוד:
- ההרשאה
"scripting"
. - הרשאות מארח או ההרשאה
"activeTab"
.
הפונקציות ב-API scripting
דומות לפונקציות ב-tabs
. יש כמה הבדלים.
- כשקוראים לשיטות האלה, מעבירים אובייקט
CSSInjection
במקוםInjectDetails
. - עכשיו הערך
tabId
מועבר כחבר בקבוצהCSSInjection.target
במקום כארגומנט method.
הדוגמה מראה איך לעשות זאת עבור insertCSS()
. ההליך ל-removeCSS()
זהה.
chrome.tabs.insertCSS(tabId, injectDetails, () => { // callback code });
בקובץ סקריפט ברקע.
const insertPromise = await chrome.scripting.insertCSS({ files: ["style.css"], target: { tabId: tab.id } }); // Remaining code.
בקובץ השירות (service worker).
החלפת פעולות הדפדפן ופעולות בדפים ב'פעולות'
פעולות דפדפן ופעולות בדפים היו מושגים נפרדים במניפסט מגרסה V2. למרות שהם התחילו עם תפקידים נפרדים, ההבדלים ביניהם הצטמצמו עם הזמן. במניפסט V3, המושגים האלה מאוחדים ב-API של Action. לשם כך נדרשים שינויים ב-manifest.json
ובקוד התוסף, השונה ממה שהייתם מוסיפים בסקריפט הרקע של Manifest V2.
הפעולות במניפסט מגרסה V3 דומות ביותר לפעולות בדפדפן. עם זאת, ה-API של action
לא מספק את hide()
ו-show()
כמו ש-pageAction
סיפק. אם עדיין יש לכם צורך בפעולות בדף, תוכלו להפעיל אותן באמצעות תוכן דקלרטיבי או להפעיל את enable()
או את disable()
עם מזהה כרטיסייה.
מחליפים את 'browser_action' ו-'page_action' ב-'action'
בשדה manifest.json
מחליפים את השדות "browser_action"
ו-"page_action"
בשדה "action"
. מידע על השדה "action"
{ ... "page_action": { ... }, "browser_action": { "default_popup": "popup.html" } ... }
{ ... "action": { "default_popup": "popup.html" } ... }
החלפת ממשקי ה-API browserAction ו-pageAction בממשק ה-API של הפעולה
אם ב-Manifest V2 השתמשתם בממשקי ה-API browserAction
ו-pageAction
, עכשיו עליכם להשתמש ב-API action
.
chrome.browserAction.onClicked.addListener(tab => { ... }); chrome.pageAction.onClicked.addListener(tab => { ... });
chrome.action.onClicked.addListener(tab => { ... });
החלפת הקריאות החוזרות (callback) בהבטחות
ב-Manifest V3, שיטות רבות של ממשקי API של תוספים מחזירות הבטחות (promises). Promise הוא שרת proxy או placeholder של ערך שהוחזר באמצעות שיטה אסינכרונית. אם אתם לא יודעים איך משתמשים ב-Promises, אתם יכולים לקרוא עליהם ב-MDN. בדף הזה נסביר מה צריך לדעת כדי להשתמש בהם בתוסף ל-Chrome.
לצורך תאימות לאחור, שיטות רבות ימשיכו לתמוך בקריאות חוזרות (callback) אחרי שתתווסף תמיכה שהובטחה. שימו לב שלא ניתן להשתמש בשתיהן באותה בקשה להפעלת פונקציה. אם מעבירים קריאה חוזרת (callback), הפונקציה לא מחזירה הבטחה, ואם רוצים שהובטחה, היא לא מעבירה קריאה חוזרת. כדי להשתמש בחלק מהתכונות של ה-API, כמו פונקציות event listener, עדיין יהיה צורך בקריאות חוזרות (callback). כדי לבדוק אם שיטה מסוימת תומכת בהבטחות, מחפשים את התווית Promise במסמך העזרה של ה-API שלה.
כדי לעבור מקריאה חוזרת להבטחה, צריך להסיר את הקריאה החוזרת ולטפל בהבטחה שהוחזרה. הדוגמה הבאה לקוחה מהדוגמה להרשאות אופציונליות, ובפרט מ-newtab.js
. גרסת הקריאה החוזרת מראה איך תיראה הקריאה מהדוגמה אל request()
עם קריאה חוזרת (callback). שימו לב שאפשר לכתוב מחדש את גרסת ההבטחה באמצעות async ו-await.
chrome.permissions.request(newPerms, (granted) => { if (granted) { console.log('granted'); } else { console.log('not granted'); } });
const newPerms = { permissions: ['topSites'] }; chrome.permissions.request(newPerms) .then((granted) => { if (granted) { console.log('granted'); } else { console.log('not granted'); } });
החלפה של פונקציות שמצפות להקשר רקע של מניפסט מגרסה V2
הקשרים אחרים של תוספים יכולים לקיים אינטראקציה עם עובדי שירות של תוספים רק באמצעות העברת הודעות. לכן, תצטרכו להחליף שיחות שמצופה בהקשר ספציפי:
chrome.runtime.getBackgroundPage()
chrome.extension.getBackgroundPage()
chrome.extension.getExtensionTabs()
סקריפטים של תוספים צריכים להשתמש בהעברת הודעות כדי לתקשר בין עובד שירות לבין חלקים אחרים בתוסף. בשלב הזה, אפשר לעשות זאת באמצעות sendMessage()
ולהטמיע את chrome.runtime.onMessage
ב-service worker של התוסף. בטווח הארוך, כדאי להחליף את הקריאות האלה ב-postMessage()
ובhandler של אירועי שליחת הודעות של Service Worker.
החלפת ממשקי API שלא נתמכים
צריך לשנות את השיטות והמאפיינים שמפורטים בהמשך ב-Manifest V3.
שיטת או מאפיין של מניפסט מגרסה V2 | החלפה עם |
---|---|
chrome.extension.connect() |
chrome.runtime.connect() |
chrome.extension.connectNative() |
chrome.runtime.connectNative() |
chrome.extension.getExtensionTabs() |
chrome.extension.getViews() |
chrome.extension.getURL() |
chrome.runtime.getURL() |
chrome.extension.lastError |
כששיטות מחזירות הבטחות, משתמשים ב-promise.catch() |
chrome.extension.onConnect |
chrome.runtime.onConnect |
chrome.extension.onConnectExternal |
chrome.runtime.onConnectExternal |
chrome.extension.onMessage |
chrome.runtime.onMessage |
chrome.extension.onRequest |
chrome.runtime.onMessage |
chrome.extension.onRequestExternal |
chrome.runtime.onMessageExternal |
chrome.extension.sendMessage() |
chrome.runtime.sendMessage() |
chrome.extension.sendNativeMessage() |
chrome.runtime.sendNativeMessage() |
chrome.extension.sendRequest() |
chrome.runtime.sendMessage() |
chrome.runtime.onSuspend (סקריפטים ברקע) |
הפעולה הזו לא נתמכת ב-service worker. במקום זאת, צריך להשתמש באירוע המסמך beforeunload . |
chrome.tabs.getAllInWindow() |
chrome.tabs.query() |
chrome.tabs.getSelected() |
chrome.tabs.query() |
chrome.tabs.onActiveChanged |
chrome.tabs.onActivated |
chrome.tabs.onHighlightChanged |
chrome.tabs.onHighlighted |
chrome.tabs.onSelectionChanged |
chrome.tabs.onActivated |
chrome.tabs.sendRequest() |
chrome.runtime.sendMessage() |
chrome.tabs.Tab.selected |
chrome.tabs.Tab.highlighted |