Utveckling av webbläsartillägg (Chrome och Edge) · Lektion

Förstå avancerade behörigheter

Utforska känsliga behörigheter som `activeTab`, `scripting` och värdbehörigheter, och lär er när och hur de ska begäras.

Lektion 1 av 411 steg

Förstå avancerade behörigheter är en gratis lektion i Utveckling av webbläsartillägg (Chrome och Edge) på CoddyKit. Detta är lektion 1 av 4. Ni kan läsa hela lektionen gratis nedan och sedan öva praktiskt i webbläsaren med en inbyggd kodredigerare och en AI-handledare som är tillgänglig dygnet runt. Den ingår i lärvägen för Utveckling av webbläsartillägg (Chrome och Edge), och Era framsteg synkroniseras mellan webben och CoddyKit-appen. Kursen i Utveckling av webbläsartillägg (Chrome och Edge) innehåller totalt 4 lektioner.

Bortom grundläggande behörigheter

Välkommen! I den här lektionen går vi igenom avancerade behörigheter för webbläsartillägg. Dessa behörigheter ger kraftfulla möjligheter och låter ditt tillägg interagera mer ingående med webbinnehåll och användardata.

Det är viktigt att förstå dem för att kunna bygga robusta tillägg och samtidigt bevara användarnas förtroende och säkerhet.

Vi går igenom:

  • Värdbehörigheter
  • Behörigheten activeTab
  • Behörigheten scripting

Ge åtkomst till webben

Värdbehörigheter är grundläggande. De anger vilka webbplatser ditt tillägg får interagera med. Det omfattar att läsa data, ändra innehåll eller göra nätverksförfrågningar på de angivna webbplatserna.

Se dem som "nycklar" som låser upp åtkomst till vissa webbadresser.

Deklarera värdåtkomst

Du deklarerar värdbehörigheter i filen manifest.json under nyckeln host_permissions. Varje sträng är ett URL-mönster.

Om du till exempel vill tillåta åtkomst till alla sidor på google.com anger du:

{
  "name": "My Extension",
  "version": "1.0",
  "manifest_version": 3,
  "host_permissions": [
    "https://www.google.com/*"
  ]
}

Bred åtkomst med jokertecken

Du kan använda jokertecken (*) för bredare åtkomst. Till exempel ger "<all_urls>" (eller "*://*/*") åtkomst till alla URL:er med alla scheman (HTTP, HTTPS).

Även om detta är kraftfullt bör breda jokertecken användas med stor försiktighet, eftersom de ger ditt tillägg betydande kontroll över användarens surfupplevelse på vilken webbplats som helst.

{
  "name": "My Extension",
  "version": "1.0",
  "manifest_version": 3,
  "host_permissions": [
    "<all_urls>"
  ]
}

Tillfälliga flikbehörigheter

Behörigheten activeTab är ett säkrare alternativ till breda värdbehörigheter för tillfälliga åtgärder på den aktuella sidan.

När användaren aktiverar ditt tillägg (till exempel genom att klicka på dess ikon) ger activeTab ditt tillägg tillfälliga värdbehörigheter för den aktiva fliken. Dessa behörigheter gäller tills användaren navigerar bort från sidan eller stänger fliken.

{
  "name": "My Extension",
  "version": "1.0",
  "manifest_version": 3,
  "permissions": [
    "activeTab"
  ]
}

Hämta den aktuella flikens URL

Med activeTab kan ditt tillägg komma åt information om den aktuella fliken, till exempel dess URL eller titel, utan permanenta värdbehörigheter.

Prova att köra det här exemplet. Föreställ dig att koden finns i tilläggets popupskript:

// This script runs when the extension popup opens.
document.addEventListener('DOMContentLoaded', function() {
  chrome.tabs.query({ active: true, currentWindow: true }, function(tabs) {
    if (tabs.length > 0) {
      const activeTab = tabs[0];
      console.log('Active tab URL:', activeTab.url);
      // Display in popup for demonstration
      document.body.innerHTML = `<p>Current URL: ${activeTab.url}</p>`;
    } else {
      document.body.innerHTML = `<p>No active tab.</p>`;
    }
  });
});

Programmatisk kodinjektion

Behörigheten scripting låter ditt tillägg programmatiskt injicera JavaScript och CSS på webbsidor. Det är så du ändrar en sidas innehåll eller beteende.

Det är en viktig behörighet för innehållsskript och ersätter Manifest V2-API:t tabs.executeScript.

{
  "name": "My Extension",
  "version": "1.0",
  "manifest_version": 3,
  "permissions": [
    "scripting"
  ],
  "host_permissions": [
    "https://www.example.com/*"
  ]
}

Ändra en sida

När du har behörigheten scripting (och värdbehörighet för målf likan) kan du injicera kod. Det här exemplet injicerar ett enkelt skript som ändrar bakgrundsfärgen på den aktiva fliken.

Föreställ dig att detta körs i ditt bakgrundsskript eller din popup:

// This code would typically run from a background script
// or popup after a user action.
chrome.tabs.query({ active: true, currentWindow: true }, function(tabs) {
  if (tabs.length > 0) {
    const activeTabId = tabs[0].id;
    chrome.scripting.executeScript({
      target: { tabId: activeTabId },
      function: () => {
        // This function runs in the context of the web page
        document.body.style.backgroundColor = 'lightblue';
        console.log('CoddyKit: Page background changed!');
      }
    });
  }
});

Principen om minsta privilegium

Följ alltid principen om minsta privilegium: begär endast de behörigheter som ditt tillägg verkligen behöver.

  • Obligatoriska behörigheter: Deklareras i manifest.json och begärs vid installationen.
  • Valfria behörigheter: Kan begäras under körning med chrome.permissions.request(), men endast när användaren behöver den specifika funktionen. Det ger användarna större kontroll och bygger förtroende.

Behörighetsscenarier

Vilken eller vilka behörigheter behöver du för ett tillägg som, när dess ikon klickas på, läser titeln på den aktuella sidan och sedan injicerar en anpassad CSS-fil på samma sida?

Sammanfattning av avancerade behörigheter

Mycket bra! Du har lärt dig om kraftfulla avancerade behörigheter:

  • Värdbehörigheter: Ger åtkomst till specifika webbplatser.
  • activeTab: Ger tillfälliga värdbehörigheter till den aktiva fliken när användaren aktiverar tillägget, vilket passar bra för tillfälliga åtgärder.
  • scripting: Gör det möjligt att programmatiskt injicera JavaScript och CSS.

Använd alltid den minst privilegierade lösningen för att säkerställa säkerhet och användarnas förtroende. Härnäst utforskar vi säkra kodningsmetoder!

Gratis att börja

Lär dig JavaScript med en AI-lärare – gratis

Skriv och kör riktig kod i webbläsaren, få omedelbar hjälp av en AI-lärare dygnet runt och fortsätt där du slutade – på webben eller i appen.

Kurser
12
Lektioner
48

Vanliga frågor

Är lektionen ”Förstå avancerade behörigheter” gratis?

Ja – hela texten till ”Förstå avancerade behörigheter” kan läsas gratis här på webben. Om Ni vill öva interaktivt med en inbyggd kodredigerare och en AI-handledare som är tillgänglig dygnet runt och låsa upp resten av kursen i Utveckling av webbläsartillägg (Chrome och Edge), kan Ni uppgradera till CoddyKit PRO. Kursen i Utveckling av webbläsartillägg (Chrome och Edge) innehåller totalt 4 lektioner.

Vad lär jag mig i ”Förstå avancerade behörigheter”?

Utforska känsliga behörigheter som `activeTab`, `scripting` och värdbehörigheter, och lär er när och hur de ska begäras. Ni övar på Utveckling av webbläsartillägg (Chrome och Edge) med praktisk kod som körs direkt i webbläsaren, medan en AI-handledare som är tillgänglig dygnet runt svarar på Era frågor under lektionen.

Behöver jag någon erfarenhet för att börja lära mig Utveckling av webbläsartillägg (Chrome och Edge)?

Du behöver inga förkunskaper. Utbildningen i Utveckling av webbläsartillägg (Chrome och Edge) på CoddyKit är upplagd för allt från nybörjare till avancerade elever, så att du kan börja här eller från början och gå fram i din egen takt. Detta är lektion 1 av 4.

Hur lång tid tar lektionen ”Förstå avancerade behörigheter”?

De flesta CoddyKit-lektioner tar cirka 5–10 minuter. Varje lektion är kort och interaktiv, så att du gör stadiga framsteg och kan fortsätta precis där du slutade – på webben eller i appen.

Kan jag skriva och köra kod i den här Utveckling av webbläsartillägg (Chrome och Edge)-lektionen?

Ja. Varje Utveckling av webbläsartillägg (Chrome och Edge)-lektion innehåller en inbyggd kodredigerare, så att du kan skriva och köra riktig kod direkt i webbläsaren och få omedelbar AI-feedback – utan lokal installation.

Alla lektioner i den här kursen

  1. Förstå avancerade behörigheter
  2. Säkra kodningsmetoder
  3. Content Security Policy (CSP)
  4. Valfria behörigheter och begäranden vid körning
← Tillbaka till Utveckling av webbläsartillägg (Chrome och Edge)