עדכון הקוד

עדכונים שלא קשורים לבעיות אחרות

זהו הקטע הראשון מתוך שלושה שמתארים את השינויים הנדרשים בקוד שאינו חלק מ-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.

בדוגמה אפשר לראות איך לעשות את זה.

Manifest V2
async function getCurrentTab() {/* ... */}
let tab = await getCurrentTab();

chrome.tabs.executeScript(
  tab.id,
  {
    file: 'content-script.js'
  }
);

בקובץ סקריפט ברקע.

מניפסט V3
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() זהה.

Manifest V2
chrome.tabs.insertCSS(tabId, injectDetails, () => {
  // callback code
});

בקובץ סקריפט ברקע.

מניפסט V3
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"

Manifest V2
{
  ...
  "page_action": { ... },
  "browser_action": {
    "default_popup": "popup.html"
   }
  ...
}
מניפסט V3
{
  ...
  "action": {
    "default_popup": "popup.html"
  }

  ...
}

החלפת ממשקי ה-API browserAction ו-pageAction בממשק ה-API של הפעולה

אם ב-Manifest V2 השתמשתם בממשקי ה-API browserAction ו-pageAction, עכשיו עליכם להשתמש ב-API action.

מניפסט מגרסה V2
chrome.browserAction.onClicked.addListener(tab => { ... });
chrome.pageAction.onClicked.addListener(tab => { ... });
מניפסט מגרסה V3
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');
  }
});
Promise
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