Code aktualisieren

Updates, die nichts mit anderen Problemen zu tun haben

Dies ist der erste von drei Abschnitten, in denen Änderungen beschrieben werden, die für Code erforderlich sind, der nicht Teil des Erweiterungs-Service-Workers 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 Ersetzen blockierter Webanfragen und die Verbesserung der Sicherheit.

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

In Manifest V3 wird executeScript() von der tabs API zur scripting API verschoben. Dazu sind nicht nur Änderungen am Code, sondern auch Änderungen an den Berechtigungen in der Manifestdatei erforderlich.

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

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

Die Methode scripting.executeScript() funktioniert ähnlich wie bei tabs.executeScript(). Es gibt ein paar Unterschiede.

  • Während die alte Methode nur eine einzelne Datei verarbeiten konnte, kann die neue Methode ein Array von Dateien verarbeiten.
  • Außerdem übergeben Sie anstelle von InjectDetails ein ScriptInjection-Objekt. 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 geht.

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

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

In einer Hintergrundskriptdatei

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 "tabs.removeCSS()" durch "scripting.insertCSS()" und "scripting.removeCSS()".

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

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

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

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

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

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

In einer Hintergrundskriptdatei

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

Browseraktionen 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 werden diese Konzepte in der Action API zusammengefasst. Dazu sind Änderungen an Ihrem manifest.json und Ihrem Erweiterungscode erforderlich, die sich von den Angaben in Ihrem Manifest V2-Hintergrundskript unterscheiden.

Aktionen in Manifest V3 ähneln am ehesten Browseraktionen. Die action API bietet jedoch nicht hide() und show() wie pageAction. Wenn Sie weiterhin 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“ mit „Aktion“

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 browserAction- und pageAction-APIs durch die action-API ersetzen

Wenn in Ihrem Manifest V2 die browserAction und die pageAction API verwendet wurden, 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 Promis 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 auf MDN darüber informieren. Auf dieser Seite erfahren Sie, was Sie wissen müssen, um sie in einer Chrome-Erweiterung zu verwenden.

Aus Gründen der Abwärtskompatibilität unterstützen viele Methoden weiterhin Callbacks, auch nachdem Promise-Unterstützung hinzugefügt wurde. Beachten Sie, dass Sie nicht beide in demselben Funktionsaufruf verwenden können. Wenn du einen Callback übergibst, gibt die Funktion kein Promise zurück. Soll ein Promise zurückgegeben werden, gib kein Callback weiter. Für einige API-Funktionen wie Event-Listener sind weiterhin Callbacks erforderlich. Suchen Sie nach dem „Promise“, um zu prüfen, ob eine Methode Promise unterstützt. in seiner API-Referenz.

Wenn du einen Callback in ein Promise konvertieren möchtest, 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() im Beispiel mit einem Callback aussehen würde. Die Promise-Version könnte mit „async“ und „await“ umgeschrieben werden.

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 per Nachrichtenweitergabe mit Erweiterungs-Service-Workern interagieren. Daher müssen Sie Anrufe ersetzen, die einen Hintergrundkontext erwarten. Insbesondere folgende:

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

Ihre Erweiterungsskripts sollten Nachrichtenweitergabe für die Kommunikation zwischen einem Service Worker und anderen Teilen Ihrer Erweiterung verwenden. Derzeit können Sie dazu sendMessage() verwenden und chrome.runtime.onMessage in Ihrem Erweiterungs-Service-Worker implementieren. Langfristig sollten Sie diese Aufrufe durch postMessage() und den Nachrichten-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.

Manifest V2-Methode oder ‐Property 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 Verwende promise.catch(), wenn Methoden Promise zurückgeben.
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 (Hintergrundskripte) Wird in Erweiterungs-Service-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