Tastaturgenveje med Commands API
Giv avancerede brugere hurtig adgang til Deres udvidelse via globale tastaturgenveje, der er defineret med commands API.
Tastaturgenveje med Commands API er en gratis Udvikling af browserudvidelser til Chrome og Edge-lektion på CoddyKit. Dette er lektion 4 af 4. Du kan læse hele lektionen gratis nedenfor — og derefter øve dig praktisk i browseren med en indbygget kodeeditor og en AI-vejleder, der er tilgængelig døgnet rundt. Den er en del af læringsforløbet i Udvikling af browserudvidelser til Chrome og Edge, og dine fremskridt synkroniseres på tværs af nettet og CoddyKit-appen. Udvikling af browserudvidelser til Chrome og Edge-kurset indeholder 4 lektioner i alt.
Hvorfor tastaturgenveje
Ud over genvejsmenuer og omnifeltet lader commands-API'et brugerne udløse handlinger med et tastetryk. Genveje får din udvidelse til at føles hurtig og professionel for erfarne brugere.
Deklarering af kommandoer
Definér hver kommando i manifestet under commands med en foreslået tastekombination for hver platform.
{
"commands": {
"toggle-feature": {
"suggested_key": { "default": "Ctrl+Shift+Y" },
"description": "Toggle the feature"
}
}
}Taster på tværs af platforme
macOS bruger Command i stedet for Ctrl. Angiv platformspecifikke forslag, så standardtasterne føles naturlige overalt.
"suggested_key": {
"default": "Ctrl+Shift+Y",
"mac": "Command+Shift+Y"
}Lytning efter kommandoer
Håndtér hændelsen onCommand i din service worker. Navnet på den kommando, du deklarerede, sendes til lytteren.
chrome.commands.onCommand.addListener((command) => {
if (command === 'toggle-feature') {
console.log('Shortcut fired')
}
})Den særlige _execute_action-kommando
En reserveret kommando med navnet _execute_action åbner din popup eller udløser klik på handlingen. Du skal ikke håndtere den i koden; det gør browseren.
{
"commands": {
"_execute_action": {
"suggested_key": { "default": "Ctrl+Shift+E" }
}
}
}Handling på den aktuelle fane
De fleste genveje fungerer på den aktive fane. Forespørg efter den i håndteringen, og send derefter en meddelelse eller indsæt et script.
chrome.commands.onCommand.addListener(async (command) => {
const [tab] = await chrome.tabs.query({ active: true, currentWindow: true })
chrome.tabs.sendMessage(tab.id, { command })
})Brugere kan ændre tasterne
Dine foreslåede taster er kun forslag. Brugerne kan ændre dem på browserens side med genveje til udvidelser, og konflikter løses dér.
// chrome://extensions/shortcuts lets users rebindBegrænset antal forslag
Browsere begrænser, hvor mange kommandoer der kan have en foreslået tast, typisk fire. Ekstra kommandoer fungerer stadig, men er ikke bundet til en tast, før brugeren tildeler en.
Læsning af registrerede kommandoer
Brug commands.getAll til at undersøge, hvilke taster der aktuelt er bundet, f.eks. når du vil vise en hjælpeskærm på siden med indstillinger.
const cmds = await chrome.commands.getAll()
cmds.forEach(c => console.log(c.name + ': ' + c.shortcut))Undgå konflikter
Vælg usædvanlige kombinationer for at mindske konflikter med browseren og andre udvidelser. Kombinationer med Shift plus et bogstav er som regel sikre.
Dokumentering af genveje
Vis dine genveje på siden med indstillinger eller under introduktionen, så brugerne opdager dem. En skjult genvej hjælper ingen.
Hurtigt tjek
Test din viden om commands-API'et.
Opsummering
Du har tilføjet tastaturgenveje:
- Deklarér dem under
commandsmed platformsspecifikke taster - Håndtér
onCommandi service worker'en - Brug
_execute_actiontil popup'en - Overhold grænsen for foreslåede taster, og respekter brugernes ændringer
- Dokumentér genveje, så de er nemme at opdage
Genveje får din udvidelse til at føles hurtig og velegnet til erfarne brugere.
Lær JavaScript med en AI-underviser — gratis
Skriv og kør rigtig kode i din browser, få øjeblikkelig hjælp fra en AI-underviser døgnet rundt, og fortsæt, hvor du slap, på web eller i appen.
- Kurser
- 12
- Lektioner
- 48
Ofte stillede spørgsmål
Er lektionen “Tastaturgenveje med Commands API” gratis?
Ja — hele teksten til “Tastaturgenveje med Commands API” kan læses gratis her på nettet. Hvis du vil øve dig interaktivt med en indbygget kodeeditor og en AI-vejleder døgnet rundt og få adgang til resten af Udvikling af browserudvidelser til Chrome og Edge-kurset, skal du opgradere til CoddyKit PRO. Udvikling af browserudvidelser til Chrome og Edge-kurset indeholder 4 lektioner i alt.
Hvad lærer jeg i “Tastaturgenveje med Commands API”?
Giv avancerede brugere hurtig adgang til Deres udvidelse via globale tastaturgenveje, der er defineret med commands API. Du øver dig i Udvikling af browserudvidelser til Chrome og Edge med praktisk kode, som du kører direkte i browseren, og en AI-vejleder døgnet rundt besvarer dine spørgsmål, mens du arbejder dig gennem lektionen.
Skal jeg have erfaring for at begynde på Udvikling af browserudvidelser til Chrome og Edge?
Der kræves ingen tidligere erfaring. Udvikling af browserudvidelser til Chrome og Edge på CoddyKit er tilrettelagt for både begyndere og øvede, så du kan starte her eller fra begyndelsen og lære i dit eget tempo. Dette er lektion 4 af 4.
Hvor lang tid tager lektionen “Tastaturgenveje med Commands API”?
De fleste CoddyKit-lektioner tager cirka 5–10 minutter. Hver lektion er kort og interaktiv, så du gør løbende fremskridt og kan fortsætte, hvor du slap – på både web og app.
Kan jeg skrive og køre kode i denne Udvikling af browserudvidelser til Chrome og Edge-lektion?
Ja. Alle Udvikling af browserudvidelser til Chrome og Edge-lektioner har en indbygget kodeeditor, så du kan skrive og køre rigtig kode direkte i din browser og få øjeblikkelig feedback fra AI – uden lokal opsætning.
Alle lektioner i dette kursus
- Tilføjelse af elementer i genvejsmenuen
- Integration af omnifeltets søgeord
- Håndtering af input fra omnifeltet
- Tastaturgenveje med Commands API