Доступ к DOM текущей вкладки из динамически внедренного Iframe из расширения и обновление iframe DOM

Question

Я разрабатываю расширение, которое добавляет пользовательскую панель инструментов вверху каждой страницы. Для этого я добавляю toolbar.html из расширения. Поскольку я новичок, я не уверен, как получить доступ к элементам DOM текущей вкладки и как обновить недавно добавленный iframe данными из DOM текущей вкладки.

Вот манифест:

{
  "manifest_version": 2,

  "name": "My Extension",
  "description": "Extension to show custom toolbar",
  "version": "1.0",

  "browser_action": {
    "default_icon": "icon.png",
    "default_popup": "popup.html"
  },
  "background":{
      "scripts":["background.js"]
  },
  "content_scripts":[{
      "matches":["https://bitbucket.mycompany.com/*"],
      "css":["styles.css"],
      "js":["jquery.js","myscript.js"],
      "all_frames":true
  }],
    "web_accessible_resources":[
        "toolbar.html",
        "styles.css"
    ]
}

Содержимое скрипта - myscript.js

var url=chrome.extension.getURL('toolbar.html');
var height='35px';
var iframe="<iframe src='"+url+"' id='myCustomBar' style='height:"+height+"'></iframe>"

$('html').append(iframe);

$('body').css({
    'transform':'translateY('+height+')'
});

Мои вопросы:

1. Если я использую отдельный сценарий содержимого (здесь ответили: доступ к содержимому iframe из сценария расширения chrome) для iframe, каким должен быть URL-адрес?
2. Существуют ли другие способы доступа к DOM текущей вкладки из динамически внедренного iframe?
3. Предположим, мне нужно это расширение для запуска на всех URL, которые имеют шаблон URL, например https://bitbucket.*.comкакие должны быть спички?

Answer 1

1. Вы не можете использовать отдельный скрипт контента для этого iframe, так как src для iframe начинается с chrome-extensions:// который по умолчанию не позволяет вводить скрипты содержимого.

2. Вы могли бы включить тег сценария для toolbar.html затем используйте Window.postMessage сделать передачу сообщений между toolbar.js и сценарии родительского содержимого.

3. Согласно шаблонам соответствия, если '*' находится в хосте, это должен быть первый символ. Таким образом, вы можете использовать что-то вроде https://*.com и проверьте другие части в вашем коде.