Spec-Zone.ru › Web Extensions

Действие на странице

Тип Object
Обязательный Нет
Версия манифеста 2 или выше
Пример
"page_action": {
  "browser_style": true,
  "default_icon": {
    "19": "button/geo-19.png",
    "38": "button/geo-38.png"
  },
  "default_title": "Whereami?",
  "default_popup": "popup/geo.html"
}

Действие на странице — это иконка, которую ваша расширение добавляет в адресную строку браузера.

Ваше расширение может также (по желанию) предоставить связанный всплывающее окно, содержимое которого задается с помощью HTML, CSS и JavaScript.

Если вы предоставляете всплывающее окно, то оно откроется, когда пользователь щелкнет по иконке, и ваш JavaScript, работающий во всплывающем окне, может обрабатывать взаимодействие пользователя с ним. Если вы не предоставляете всплывающее окно, то при щелчке по иконке событие клика будет отправлено в скрипты фона вашего расширения скрипты фона.

Вы также можете создавать и изменять действия на странице программно, используя pageAction API.

Действия на странице похожи на действия в браузере, за исключением того, что они связаны с конкретными веб-страницами, а не с браузером в целом. Если действие актуально только на определённых страницах, следует использовать действие на странице и отображать его только на соответствующих страницах. Если действие актуально для всех страниц или для самого браузера, используйте действие в браузере.

В то время как действия в браузере отображаются по умолчанию, действия на странице скрыты по умолчанию. Их можно отобразить для конкретной вкладки, вызвав pageAction.show(), передав в него id. Вы также можете изменить это поведение по умолчанию, используя свойство show_matches.

Синтаксис

Ключ page_action — это объект, который может иметь любые три свойства, все необязательные:

Имя Тип Описание
browser_style Boolean

Необязательно. По умолчанию false.

Используйте это, чтобы включить в всплывающее окно таблицу стилей, которая будет выглядеть согласованно с интерфейсом браузера и другими расширениями, использующими свойство browser_style. Хотя этот ключ по умолчанию false, рекомендуется включить его и установить значение true, чтобы всплывающие окна соответствовали внешнему виду остальной части пользовательского интерфейса браузера.

В Firefox таблицу стилей можно найти в chrome://browser/content/extension.css, или chrome://browser/content/extension-mac.css на macOS.

Руководство по стилю Firefox описывает классы, которые вы можете применять к элементам во всплывающем окне, чтобы получить определенные стили.

Пример расширения latest-download использует browser_style в своём всплывающем окне.

default_icon Object или String

Используйте это, чтобы указать иконку для действия.

Рекомендуется предоставить две иконки (19×19 пикселей и 38×38 пикселей) и указать их в объекте со свойствами, имеющими названия "19" и "38", например так:

    "default_icon": {
      "19": "geo-19.png",
      "38": "geo-38.png"
    }

В этом случае браузер выберет иконку подходящего размера для плотности пикселей экрана.

Вы можете просто указать строку здесь:

"default_icon": "geo.png"

В этом случае иконка будет масштабироваться для соответствия панели инструментов и может выглядеть размытой.

default_popup String

Путь к файлу HTML, содержащему описание всплывающего окна.

Файл HTML может включать файлы CSS и JavaScript с помощью элементов <link> и <script>, как и обычная веб-страница. Однако не используйте <script> с встраиваемым кодом, поскольку вы получите ошибку политики нарушения содержимого. Вместо этого <script> должен использовать атрибут src для загрузки отдельного файла скрипта.

В отличие от обычной веб-страницы, JavaScript, работающий во всплывающем окне, может получить доступ ко всем API расширений WebExtension (разумеется, при условии, что у расширения есть соответствующие разрешения).

Это локализуемое свойство.

default_title String

Подсказка для иконки, отображаемая при наведении курсора мыши на неё.

Это локализуемое свойство.

hide_matches Array из Match Pattern за исключением <all_urls>

Скрыть действие на странице по умолчанию для страниц, адреса которых соответствуют любому из указанных шаблонов соответствия.

Обратите внимание, что действия на странице всегда скрыты по умолчанию, если не указано show_matches. Поэтому этот параметр имеет смысл только при указании также show_matches, и переопределит шаблоны в show_matches.

Например, рассмотрим значение:

"page_action": {
  "show_matches": ["https://*.mozilla.org/*"],
  "hide_matches": ["https://developer.mozilla.org/*"]
}

Это показывает действие на странице по умолчанию для всех HTTPS-адресов домена "mozilla.org", за исключением страниц в домене "developer.mozilla.org".

show_matches Array из Match Pattern

Отобразить действие на странице по умолчанию для страниц, адреса которых соответствуют указанным шаблонам.

См. также hide_matches.

pinned Устаревшее Boolean

Необязательно. По умолчанию true.

Управляет тем, отображается ли действие на странице в адресной строке по умолчанию при установке расширения. Это свойство больше не поддерживается в Firefox 89.

Пример

"page_action": {
  "default_icon": {
    "19": "button/geo-19.png",
    "38": "button/geo-38.png"
  }
}

Действие на странице только с иконкой, указанной в 2 разных размерах. Скрипты фона расширения могут получать события клика, когда пользователь нажимает на иконку, используя код, подобный этому:

 browser.pageAction.onClicked.addListener(handleClick);
"page_action": {
  "default_icon": {
    "19": "button/geo-19.png",
    "38": "button/geo-38.png"
  },
  "default_title": "Whereami?",
  "default_popup": "popup/geo.html"
}

Действие на странице с иконкой, заголовком и всплывающим окном. Всплывающее окно будет показано, когда пользователь нажмёт на иконку.

Совместимость с браузерами

Рабочий стол Мобильный
Chrome Edge Firefox Internet Explorer Opera Safari WebView Android Chrome Android Firefox for Android Opera Android Safari на IOS Samsung Internet
page_action
Да["С Chrome 49 действия на странице отображаются в панели инструментов, а не в адресной строке.", "Если расширение определяет действие на странице, ему запрещено определять действие в браузере."]
14 48 ?
ДаЕсли расширение определяет действие на странице, ему запрещено определять действие в браузере.
14Если расширение определяет действие на странице, ему запрещено определять действие в браузере.
? ? Да ?
15Если расширение определяет действие на странице, ему запрещено определять действие в браузере.
?
browser_style Нет Нет 48 ? Нет Нет ? ? Нет ? Нет ?
default_icon
ДаSVG-иконки не поддерживаются.
14["SVG-иконки не поддерживаются.", "'default_icon' должен быть объектом со явными размерами."]
48 ?
ДаSVG-иконки не поддерживаются.
14SVG-иконки не поддерживаются. Оттененные изображения будут обрабатываться как шаблоны иконки, используя системный акцент и вид.
? ? Да ?
15SVG-иконки не поддерживаются. Оттененные изображения будут обрабатываться как шаблоны иконки, используя системный акцент и вид.
?
default_popup Да 14 48 ? Да 14 ? ? Да ? 15 ?
default_title Да 14 48 ? Да 14 ? ? Да ? 15 ?
hide_matches Нет Нет 59 ? Нет Нет ? ? 59 ? Нет ?
pinned Нет Нет 64 ? Нет Нет ? ? Нет ? Нет ?
show_matches Нет Нет 59 ? Нет Нет ? ? 79 ? Нет ?

См. также

  • browser_action
  • sidebar_action
  • Стили браузера

© 2005–2023 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/page_action

Spec-Zone.ru

Настройки Оффлайн Что нового Помощь О нас
Spec-Zone .ru
спецификации, руководства, описания, API