google-chrome-extension Handledning
Komma igång med google-chrome-tillägg

Anmärkningar

Absolut minimumsexempel

Alla Chrome-förlängningar startar som ett uppackat tillägg : en mapp som innehåller tilläggets filer.

En fil den måste innehålla är manifest.json , som beskriver de grundläggande egenskaperna för tillägget. Många av egenskaperna i den filen är valfria, men här är en absolut minimal manifest.json fil:

{
  "manifest_version": 2,
  "name": "My Extension",
  "version": "1.0"
}

Skapa en mapp (till exempel myExtension ) någonstans, lägg till manifest.json som listad ovan till den.

Sedan måste du ladda tillägget i Chrome.

1. Öppna chrome://extensions/ sida, tillgänglig meny> Fler verktyg> Tillägg .
2. Aktivera utvecklarläge med en kryssruta uppe till höger om det inte redan är aktiverat.
3. Klicka på Load unpacked extension ... -knappen och välj den skapade myExtension mappen.

Det är allt! Din första tillägg laddas av Chrome:

Naturligtvis gör det ingenting ännu, så det är ett bra ögonblick att läsa en översikt över tilläggsarkitektur för att börja lägga till delar du behöver.

Viktigt: När du gör några ändringar i ditt tillägg, glöm inte att återgå till chrome://extensions/ och tryck på länken Ladda om för ditt tillägg när du har gjort ändringar. Vid innehållsskript läser du också in målsidan.

Bakgrundssida

Bakgrundsidor är implicita sidor som innehåller bakgrundsskript. Ett bakgrundsskript är ett enda långtgående skript för att hantera någon uppgift eller tillstånd. Det finns under din förlängningstid och bara en instans av den i taget är aktiv.

Du kan förklara det så här i ditt manifest.json :

"background": {
    "scripts": ["background.js"]
}

En bakgrundsida kommer att genereras av förlängningssystemet som innehåller var och en av filerna i skriptegenskapen.

Du har tillgång till alla tillåtna chrome.* API: er.

Det finns två typer av bakgrundsidor: ihållande bakgrundsidor som alltid är öppna och händelsessidor som öppnas och stängs vid behov.

Om du vill att din bakgrundsida ska vara icke-beständig måste du bara ställa in den persistent -flaggan till falsk:

"background": {
    "scripts": ["eventPage.js"],
    "persistent": false
}

Detta bakgrundsskript är endast aktivt om en händelse avfyras som du har lyssnat på. I allmänhet använder du en addListener för registrering.

Exempel: Appen eller tillägget installeras först.

chrome.runtime.onInstalled.addListener(function() {
   console.log("The Extension is installed!");
});

Innehållsskript

Ett innehållsskript är en tilläggskod som körs längs en vanlig sida.

De har full åtkomst till webbsidans DOM (och är i själva verket den enda delen av tillägget som har åtkomst till en sidas DOM ), men JavaScript-koden är isolerad, ett koncept som kallas Isolated World . Varje tillägg har sitt eget innehållsskript JavaScript-sammanhang osynligt för andra och sidan, vilket förhindrar kodkonflikter.

Exempel på definition i manifest.json :

  "content_scripts": [
    {
      "matches": ["http://www.stackoverflow.com/*"],
      "css": ["style.css"],
      "js": ["jquery.js", "myscript.js"]
    }
  ]

Attributen har följande betydelse:

Innehållsskript kan också injiceras på begäran med chrome.tabs.executeScript , som kallas Programmatic Injection .

Se även

• Officiell dokumentation: Innehållsskript
• Stack Overflow-dokumentation: Innehållsskript

Alternativ sida

Alternativsidor används för att ge användaren möjlighet att behålla inställningar för ditt tillägg.

Version 2

Sedan Chrome 40 finns möjligheten att ha alternativssidan som en fördefinierad dialog på chrome: // extensions .

Sättet att definiera en alternativsida i manifest.json är på följande sätt:

"options_ui": {
    "page": "options.html",
    "chrome_style": true
}

Denna alternativsida fungerar som en dialog, den öppnas som en popup, där alternativen.html visas. chrome_style kommer att tillämpa ett Chrome-formatmall av skäl för stilkonsistens på din alternativsida.

Alternativen kommer att exponeras automatiskt via snabbmenyn på tilläggsknappen eller chrome: // extensions- sidan.

Du kan också öppna alternativssidan programmatiskt , till exempel från ett popup-användargränssnitt:

chrome.runtime.openOptionsPage();

Version 1 ( utgått )

Exempel på definition i manifest.json :

"options_page": "options.html"

Det rekommenderas att använda version 2 eftersom options_ui beteendet snart kommer att tillämpas på alternativsidorna med version 1.

Lagring

Normalt måste inställningarna kvarstå, så att använda chrome.storage API rekommenderas. Behörigheterna kan deklareras så här i manifest.json :

"permissions": [
   "storage"
]

Officiell dokumentation

• Alternativsida - version 1
• Alternativsida - version 2
• Storage API

Skapa en ny flik

I tilläggskoden kan du använda valfritt chrome.* API om du har avmarkerat de nödvändiga behörigheterna. Dessutom fungerar vissa API: er bara från bakgrundsidor, och vissa API: er fungerar endast från innehållsskript.

Du kan använda de flesta av chrome.tabs metoder som förklarar eventuella behörigheter. Nu fokuserar vi på chrome.tabs.create

_{Obs! Den nya fliken öppnas utan någon popup varning.}

chrome.tabs.create({
       url:"http://stackoverflow.com",
       selected:false  // We open the tab in the background
})

Du kan lära dig mer om flikobjekt i den officiella kromutvecklaren