Code aktualisieren

Updates, die nichts mit anderen Problemen zu tun haben

Dies ist der erste von drei Abschnitten, in denen Änderungen für Code beschrieben werden, der nicht Teil des Extension Service Worker ist. Dieser Abschnitt bezieht sich auf erforderliche Codeänderungen, die nichts mit anderen Problemen zu tun haben. In den nächsten beiden Abschnitten geht es um das Blockieren von Webanfragen und die Verbesserung der Sicherheit.

Tabs.executeScript() durch scripting.executeScript() ersetzen

In Manifest V3 wird executeScript() von der tabs API in die scripting API verschoben. Dazu sind neben den tatsächlichen Codeänderungen auch Änderungen an den Berechtigungen in der Manifestdatei erforderlich.

Für die Methode executeScript() benötigen Sie:

  • Die Berechtigung "scripting".
  • Entweder Hostberechtigungen oder die Berechtigung "activeTab".

Die Methode scripting.executeScript() ähnelt der Methode tabs.executeScript(). Es gibt einige Unterschiede.

  • Während bei der alten Methode nur eine Datei verwendet werden konnte, kann bei der neuen Methode ein Array von Dateien verwendet werden.
  • Außerdem übergeben Sie ein ScriptInjection-Objekt anstelle von InjectDetails. Es gibt mehrere Unterschiede zwischen den beiden. Beispielsweise wird tabId jetzt als Element von ScriptInjection.target und nicht als Methodenargument übergeben.

Das Beispiel zeigt, wie das funktioniert.

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

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

In einer Hintergrund-Scriptdatei

Manifest V3
async function getCurrentTab()
let tab = await getCurrentTab();

chrome.scripting.executeScript({
  target: {tabId: tab.id},
  files: ['content-script.js']
});

Im Erweiterungs-Service-Worker.

Ersetzen Sie „tabs.insertCSS()“ und „Tabulators.removeCSS()“ durch „scripting.insertCSS()“ und „scripting.removeCSS()“

In Manifest V3 werden insertCSS() und removeCSS() von der tabs API zur scripting API verschoben. Dazu sind neben Codeänderungen noch Änderungen an den Berechtigungen in der Manifestdatei erforderlich:

  • Die Berechtigung "scripting".
  • Entweder Hostberechtigungen oder die Berechtigung "activeTab".

Die Funktionen in der scripting API ähneln den Funktionen in tabs. Es gibt einige Unterschiede.

  • Beim Aufrufen dieser Methoden übergeben Sie ein CSSInjection-Objekt anstelle von InjectDetails.
  • tabId wird jetzt als Element von CSSInjection.target und nicht als Methodenargument übergeben.

Das Beispiel zeigt, wie dies für insertCSS() funktioniert. Die Vorgehensweise für removeCSS() ist dieselbe.

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

In einer Hintergrund-Scriptdatei

Manifest V3
const insertPromise = await chrome.scripting.insertCSS({
  files: ["style.css"],
  target: { tabId: tab.id }
});
// Remaining code. 

Im Erweiterungs-Service-Worker.

Browseraktionen und Seitenaktionen durch Aktionen ersetzen

Browser- und Seitenaktionen waren in Manifest V2 unterschiedliche Konzepte. Obwohl sie mit unterschiedlichen Rollen begannen, nahmen die Unterschiede zwischen ihnen mit der Zeit ab. In Manifest V3 sind diese Konzepte in der Action API zusammengefasst. Hierfür sind Änderungen an manifest.json und Erweiterungscode erforderlich, die sich von den Änderungen in deinem Manifest V2-Hintergrundskript unterscheiden.

Aktionen in Manifest V3 ähneln Browseraktionen am ehesten. Die action API stellt hide() und show() jedoch nicht wie pageAction bereit. Wenn Sie weitere Seitenaktionen benötigen, können Sie diese entweder mithilfe von deklarativen Inhalten emulieren oder enable() oder disable() mit einer Tab-ID aufrufen.

Ersetzen Sie „browser_action“ und „page_action“ durch „action“.

Ersetzen Sie in manifest.json die Felder "browser_action" und "page_action" durch das Feld "action". Informationen zum Feld "action" finden Sie in der Referenz.

Manifest V2
{
  ...
  "page_action": { ... },
  "browser_action": {
    "default_popup": "popup.html"
   }
  ...
}
Manifest V3
{
  ...
  "action": {
    "default_popup": "popup.html"
  }

  ...
}

Die APIs „browserAction“ und „pageAction“ durch die Aktions-API ersetzen

Wenn Manifest V2 die API browserAction und pageAction verwendet hat, sollten Sie jetzt die action API verwenden.

Manifest V2
chrome.browserAction.onClicked.addListener(tab => { ... });
chrome.pageAction.onClicked.addListener(tab => { ... });
Manifest V3
chrome.action.onClicked.addListener(tab => { ... });

Callbacks durch Promise ersetzen

In Manifest V3 geben viele Erweiterungs-API-Methoden Promise zurück. Ein Promise ist ein Proxy oder Platzhalter für einen Wert, der von einer asynchronen Methode zurückgegeben wird. Wenn Sie Promises noch nie verwendet haben, können Sie sich in der MDN darüber informieren. Auf dieser Seite wird beschrieben, was Sie zur Verwendung in einer Chrome-Erweiterung wissen müssen.

Aus Gründen der Abwärtskompatibilität unterstützen viele Methoden weiterhin Callbacks, nachdem Promise-Unterstützung hinzugefügt wurde. Beachten Sie, dass Sie nicht beide in einem Funktionsaufruf verwenden können. Wenn du einen Callback übergibst, gibt die Funktion kein Promise zurück, und wenn du möchtest, dass ein Promise zurückgegeben wird, gib keinen Callback weiter. Für einige API-Funktionen wie Ereignis-Listener sind weiterhin Callbacks erforderlich. Um zu überprüfen, ob eine Methode Promise unterstützt, suchen Sie in der API-Referenz nach dem Label „Promise“.

Um einen Callback in ein Promise umzuwandeln, entferne den Callback und verarbeite das zurückgegebene Promise. Das folgende Beispiel stammt aus dem Beispiel für optionale Berechtigungen, insbesondere newtab.js. Die Callback-Version zeigt, wie der Aufruf von request() mit einem Callback im Beispiel aussehen würde. Beachte, dass die Promise-Version mit „async“ und „await“ umgeschrieben werden kann.

Rückruf
chrome.permissions.request(newPerms, (granted) => {
  if (granted) {
    console.log('granted');
  } else {
    console.log('not granted');
  }
});
Versprechen
const newPerms = { permissions: ['topSites'] };
chrome.permissions.request(newPerms)
.then((granted) => {
  if (granted) {
    console.log('granted');
  } else {
    console.log('not granted');
  }
});

Funktionen ersetzen, die einen Manifest V2-Hintergrundkontext erwarten

Andere Erweiterungskontexte können nur über die Nachrichtenübergabe mit Erweiterungsdienst-Workern interagieren. Daher müssen Sie Aufrufe ersetzen, die einen Hintergrundkontext erwarten, insbesondere:

  • chrome.runtime.getBackgroundPage()
  • chrome.extension.getBackgroundPage()
  • chrome.extension.getExtensionTabs()

In Erweiterungsskripts sollte die Nachrichtenweitergabe verwendet werden, um zwischen einem Service Worker und anderen Teilen der Erweiterung zu kommunizieren. Derzeit umfasst dies die Verwendung von sendMessage() und die Implementierung von chrome.runtime.onMessage in Ihrem Erweiterungs-Service-Worker. Langfristig sollten Sie diese Aufrufe durch postMessage() und den Message Event-Handler eines Service Workers ersetzen.

Nicht unterstützte APIs ersetzen

Die unten aufgeführten Methoden und Eigenschaften müssen in Manifest V3 geändert werden.

Methode oder Property von Manifest V2 Ersetzen durch
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 Wenn Methoden Promise zurückgeben, verwende 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 (Hintergrund-Scripts) Wird in Erweiterungsdienst-Workern nicht unterstützt. Verwenden Sie stattdessen das Dokumentereignis 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