Сочетания клавиш с API Commands
Предоставьте опытным пользователям быстрый доступ к расширению через глобальные сочетания клавиш, заданные с помощью API commands.
«Сочетания клавиш с API Commands» — бесплатный урок Browser Extensions Development (Chrome & Edge) на CoddyKit. Это урок 4 из 4. Ты можешь прочитать весь урок бесплатно ниже — а потом практиковать его прямо в браузере с встроенным редактором кода и ИИ-репетитором 24/7. Это часть пути обучения Browser Extensions Development (Chrome & Edge), и твой прогресс синхронизируется между веб-версией и приложением CoddyKit. Курс Browser Extensions Development (Chrome & Edge) содержит 4 уроков всего.
Части этого урока еще не переведены и отображаются на английском.
Why Keyboard Shortcuts
Beyond context menus and the omnibox, the commands API lets users trigger actions with a keystroke. Shortcuts make your extension feel fast and professional to power users.
Declaring Commands
Define each command in the manifest under commands, with a suggested key combination per platform.
{
"commands": {
"toggle-feature": {
"suggested_key": { "default": "Ctrl+Shift+Y" },
"description": "Toggle the feature"
}
}
}Cross-Platform Keys
macOS uses Command instead of Ctrl. Provide platform-specific suggestions so the default keys feel native everywhere.
"suggested_key": {
"default": "Ctrl+Shift+Y",
"mac": "Command+Shift+Y"
}Listening for Commands
In your service worker, handle the onCommand event. The command name you declared is passed to the listener.
chrome.commands.onCommand.addListener((command) => {
if (command === 'toggle-feature') {
console.log('Shortcut fired')
}
})The Special _execute_action Command
A reserved command named _execute_action opens your popup or fires the action click. You do not handle it in code; the browser does.
{
"commands": {
"_execute_action": {
"suggested_key": { "default": "Ctrl+Shift+E" }
}
}
}Acting on the Current Tab
Most shortcuts operate on the active tab. Query it inside the handler, then send a message or inject a script.
chrome.commands.onCommand.addListener(async (command) => {
const [tab] = await chrome.tabs.query({ active: true, currentWindow: true })
chrome.tabs.sendMessage(tab.id, { command })
})Users Can Rebind Keys
Your suggested keys are only suggestions. Users can change them on the browser's extension shortcuts page, and conflicts are resolved there.
// chrome://extensions/shortcuts lets users rebindLimited Number of Suggestions
Browsers limit how many commands can have a suggested key (commonly four). Extra commands still work but start unbound until the user assigns a key.
Reading Registered Commands
Use commands.getAll to inspect what keys are currently bound, useful for showing a help screen in your options page.
const cmds = await chrome.commands.getAll()
cmds.forEach(c => console.log(c.name + ': ' + c.shortcut))Avoiding Conflicts
Pick uncommon combinations to reduce clashes with the browser and other extensions. Combos with Shift plus a letter are usually safe.
Documenting Shortcuts
List your shortcuts in the options page or onboarding so users discover them. A hidden shortcut helps no one.
Quick Check
Test your commands API knowledge.
Recap
You added keyboard shortcuts:
- Declare them under
commandswith per-platform keys - Handle
onCommandin the service worker - Use
_execute_actionfor the popup - Respect the suggested-key limit and user rebinds
- Document shortcuts for discoverability
Shortcuts make your extension feel fast and power-user friendly.
Изучай JavaScript с ИИ-репетитором — бесплатно
Пиши и запускай код прямо в браузере, получай мгновенную помощь от ИИ-репетитора 24/7 и продолжи учиться на сайте или в приложении.
- Курсы
- 12
- Уроки
- 48
Часто задаваемые вопросы
Урок «Сочетания клавиш с API Commands» бесплатный?
Да — полный текст урока «Сочетания клавиш с API Commands» бесплатно доступен здесь в веб-версии. Чтобы практиковать его интерактивно (встроенный редактор кода и ИИ-репетитор 24/7) и разблокировать остальной курс Browser Extensions Development (Chrome & Edge), подпишись на CoddyKit PRO. Курс Browser Extensions Development (Chrome & Edge) содержит 4 уроков всего.
Чему я научусь в уроке «Сочетания клавиш с API Commands»?
Предоставьте опытным пользователям быстрый доступ к расширению через глобальные сочетания клавиш, заданные с помощью API commands. Ты практикуешь Browser Extensions Development (Chrome & Edge) с помощью реального кода, который запускаешь прямо в браузере, и ИИ-репетитор 24/7 отвечает на твои вопросы во время урока.
Нужен ли мне опыт, чтобы начать Browser Extensions Development (Chrome & Edge)?
Предыдущий опыт не требуется. Browser Extensions Development (Chrome & Edge) на CoddyKit структурирован для всех уровней — от новичков до продвинутых, поэтому ты можешь начать отсюда или с самого начала и учиться в своем темпе. Это урок 4 из 4.
Сколько времени занимает урок «Сочетания клавиш с API Commands»?
Большинство уроков CoddyKit занимают около 5–10 минут. Каждый из них компактный и интерактивный, поэтому ты постоянно делаешь прогресс и продолжаешь с того же места в веб-версии и приложении.
Можно ли писать и запускать код в этом уроке Browser Extensions Development (Chrome & Edge)?
Да. Каждый урок Browser Extensions Development (Chrome & Edge) включает встроенный редактор кода, поэтому ты пишешь и запускаешь реальный код прямо в браузере и получаешь моментальную обратную связь от AI — локальная установка не требуется.
Все уроки этого курса
- Добавление пунктов контекстного меню
- Интеграция ключевых слов омнибокса
- Обработка ввода в омнибоксе
- Сочетания клавиш с API Commands