Update uw code

Updates die geen verband houden met andere problemen

Dit is de eerste van drie secties waarin de wijzigingen worden beschreven die nodig zijn voor code die geen deel uitmaakt van de uitbreidingsservicemedewerker. Deze sectie is bedoeld voor vereiste codewijzigingen die geen verband houden met andere problemen. De volgende twee secties behandelen het vervangen van blokkerende webverzoeken en het verbeteren van de beveiliging .

Vervang tabs.executeScript() door scripting.executeScript()

In Manifest V3 gaat executeScript() van de tabs -API naar de scripting API. Hiervoor zijn wijzigingen in de machtigingen in het manifestbestand vereist, naast daadwerkelijke codewijzigingen.

Voor de executeScript() methode heb je nodig:

  • De toestemming "scripting" .
  • Hostmachtigingen of de machtiging "activeTab" .

De methode scripting.executeScript() is vergelijkbaar met hoe deze werkte met tabs.executeScript() . Er zijn een paar verschillen.

  • Terwijl de oude methode slechts één bestand kon bevatten, kan de nieuwe methode een reeks bestanden bevatten.
  • U geeft ook een ScriptInjection object door in plaats van InjectDetails . Er zijn meerdere verschillen tussen de twee. De tabId wordt nu bijvoorbeeld doorgegeven als lid van ScriptInjection.target in plaats van als methodeargument.

Het voorbeeld laat zien hoe u dit kunt doen.

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

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

In een achtergrondscriptbestand.

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

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

In de extensie servicemedewerker.

Vervang tabs.insertCSS() en tabs.removeCSS() door scripting.insertCSS() en scripting.removeCSS()

In Manifest V3 gaan insertCSS() en removeCSS() van de tabs -API naar de scripting API . Hiervoor zijn naast codewijzigingen wijzigingen in de machtigingen in het manifestbestand vereist:

  • De toestemming "scripting" .
  • Hostmachtigingen of de machtiging "activeTab" .

De functies op de scripting API zijn vergelijkbaar met de functies op tabs . Er zijn een paar verschillen.

  • Wanneer u deze methoden aanroept, geeft u een CSSInjection object door in plaats van InjectDetails .
  • De tabId wordt nu doorgegeven als lid van CSSInjection.target in plaats van als methodeargument.

Het voorbeeld laat zien hoe u dit kunt doen voor insertCSS() . De procedure voor removeCSS() is hetzelfde.

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

In een achtergrondscriptbestand.

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

In de extensie servicemedewerker.

Vervang browseracties en pagina-acties door acties

Browseracties en paginaacties waren afzonderlijke concepten in Manifest V2. Hoewel ze begonnen met verschillende rollen, namen de verschillen tussen hen in de loop van de tijd af. In Manifest V3 worden deze concepten geconsolideerd in de Action API. Hiervoor zijn wijzigingen in uw manifest.json en extensiecode vereist die anders zijn dan wat u in uw Manifest V2-achtergrondscript zou hebben geplaatst.

Acties in Manifest V3 lijken het meest op browseracties; de action API biedt echter geen hide() en show() zoals pageAction dat deed. Als u nog steeds paginaacties nodig heeft, kunt u deze emuleren met behulp van declaratieve inhoud of enable() of disable() aanroepen met een tabblad-ID.

Vervang "browser_action" en "page_action" door "action"

Vervang in manifest.json de velden "browser_action" en "page_action" door het veld "action" . Raadpleeg de referentie voor informatie over het veld "action" .

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

  ...
}

Vervang de browserAction- en pageAction-API's door de action-API

Waar uw Manifest V2 de browserAction en pageAction API's gebruikte, moet u nu de action API gebruiken.

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

Vervang terugbelverzoeken door beloftes

In Manifest V3 retourneren veel uitbreidings-API-methoden beloften. Een belofte is een proxy of tijdelijke aanduiding voor een waarde die wordt geretourneerd door een asynchrone methode. Als u Promises nog nooit hebt gebruikt, kunt u hierover lezen op MDN . Op deze pagina wordt beschreven wat u moet weten om ze in een Chrome-extensie te gebruiken.

Voor achterwaartse compatibiliteit blijven veel methoden callbacks ondersteunen nadat belofte-ondersteuning is toegevoegd. Houd er rekening mee dat u niet beide kunt gebruiken bij dezelfde functieaanroep. Als u een callback doorgeeft, retourneert de functie geen belofte en als u een callback wilt terugsturen, geeft u geen callback door. Voor sommige API-functies, zoals gebeurtenislisteners, blijven callbacks vereist. Om te controleren of een methode beloftes ondersteunt, zoekt u naar het label 'Promise' in de API-referentie ervan.

Om een ​​terugbelverzoek om te zetten in een belofte, verwijdert u het terugbelverzoek en handelt u de geretourneerde belofte af. Het onderstaande voorbeeld is afkomstig uit het voorbeeld van optionele machtigingen , specifiek newtab.js . De callback-versie laat zien hoe de aanroep van het voorbeeld naar request() eruit zou zien met een callback. Merk op dat de belofteversie async herschreven kan worden en kan wachten.

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

Vervang functies die een Manifest V2-achtergrondcontext verwachten

Andere extensiecontexten kunnen alleen communiceren met medewerkers van de extensieservice via het doorgeven van berichten . Daarom moet u oproepen vervangen die een achtergrondcontext verwachten, met name:

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

Uw extensiescripts moeten gebruikmaken van het doorgeven van berichten om te communiceren tussen een servicemedewerker en andere delen van uw extensie. Momenteel kan dit worden bereikt door sendMessage() te gebruiken en chrome.runtime.onMessage te implementeren in uw uitbreidingsservicemedewerker. Op de lange termijn moet u van plan zijn deze aanroepen te vervangen door postMessage() en de message event handler van een servicemedewerker.

Vervang niet-ondersteunde API's

De onderstaande methoden en eigenschappen moeten veranderen in Manifest V3.

Manifest V2-methode of eigenschap Vervangen door
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 Waar methoden beloftes retourneren, gebruik 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 (achtergrondscripts) Niet ondersteund in extensieservicewerknemers. Gebruik in plaats daarvan de documentgebeurtenis 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