Как установить разные стили для сотен разных URL в расширении браузера? - PullRequest
Новая
       37

Как установить разные стили для сотен разных URL в расширении браузера?

0 голосов
/ 13 февраля 2019

Я изучаю, как создавать расширения для браузера, используя простой пример с сайта Mozilla, который добавляет красную рамку к любым страницам, загруженным с сайта "mozilla.org" или любых его поддоменов.Как установить разные стили для сотен разных URL-адресов?

Я попытался добавить новый стиль в файл manifest.json, и он работает (см. Раздел content_scripts): 

{

  "manifest_version": 2,
  "name": "Borderify",
  "version": "1.0",

  "description": "Adds a solid red border to all webpages matching mozilla.org.",
  "icons": {
    "48": "icons/border-48.png"
  },

  "applications": {
    "gecko": {
      "id": "borderify@mozilla.org",
      "strict_min_version": "45.0"
    }
  },

  "content_scripts": [
    {
      "matches": ["*://*.mozilla.org/*", "*://*.google.com/*"],
      "js": ["borderify.js"]
    },
    {
      "matches": ["*://*.opera.com/*", "*://*.stackoverflow.com/*"],
      "js": ["borderify_green.js"]
    }
  ]

}

Здесь файлы borderify.js и borderify_green.js содержат правила стилей: 

document.body.style.border = "5px solid red";

и 

document.body.style.border = "5px solid green";

соответственно.

Но если мне нужно установить разные стили для сотен URL-адресов?Я предполагаю, что я не могу использовать файл manifest.json для этой цели, и мне нужно установить эти стили в отдельном файле.

Как правильно установить эти стили для сотен URL-адресов?

1 Ответ

0 голосов
/ 13 февраля 2019

В вашем manifest.json посмотрите на часть content_scripts, особенно на те два объекта внутри нее.

Свойство matches этих объектов сообщает вашему расширению, по каким URL должен выполняться ваш код.

Чтобы выполнить определенный код на каждой странице:

Чтобы выполнить код на каждом сайте (просто в качестве примера), измените "*://*.mozilla.org/*", "*://*.google.com/*"] на ["*://*"].

* действует как «любой».Для вашего расширения *://*.mozilla.org/* означает: «Выполнить код по любому протоколу на любом поддомене mozilla.org в любом каталоге».

*://* означает «Выполнить код по любому протоколу в любом домене.

Чтобы выполнить другой код на разных URL-адресах :

Боюсь, в этом случае вам нужно добавить каждый конкретный случай в манифест вручную: 

{
   "matches": ["*://*.mozilla.org/*"],
   "js": ["borderify.js"]
},
{
   "matches": ["*://*.opera.com/*"],
   "js": ["borderify_green.js"]
},
{ 
   "matches": ["*://*.somedomain.com/*"],
   "js": ["some_file.js"]
}

В качестве альтернативы, вы можете выполнить некоторый код на каждой странице, который проверяет, на какой странице вы находитесь, и загружает соответствующий файл .js этой страницы.

...