Расширение Chrome ContentScript с iframe «заблокировало фрейм с источником от доступа к фрейму перекрестного происхождения» - PullRequest
0 голосов
/ 01 декабря 2018

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

Итак, вот основная проблема.У меня есть скрипт контента, который запускается на https://example.com/* совпадениях с целью изменения игрока HTML5 <video> на странице.Фактический игрок, однако, находится в пределах iframe.Чтобы получить фактический HTMLMediaElement, я должен иметь возможность запустить

document.querySelector("iframe").contentWindow.document.querySelector("video")

Однако, это происходит с ошибкой

Uncaught DOMException: Blocked a frame with origin "https://example.com" from accessing a cross-origin frame.

Для дополнительной информации document.querySelector("iframe").src возвращает https://static.example.com/.../player.html.«Источник» отличается, но это тот же корневой домен исходного сайта.

Поэтому мне интересно, как я могу использовать скрипт контента (или, я полагаю, любой другой метод) для манипулирования мультимедиаигрок в iframe.


Вот как примерно выглядит расширение.

manifest.json

{
    "manifest_version": 2,
    //...
    "permissions": ["activeTab", "storage", "https://example.com/*"],
    //...
    "content_scripts": [
        {
            "all_frames": true,
            "matches": [
                "https://example.com/*"
            ],
            "js": [
                "inject.js"
            ]
        }
    ],
    //...
}

inject.js

winndow.onload = () => {
    document
        .querySelector("iframe.video-player")
        .contentWindow.document
        .querySelector("video#player_html5_api");
};

Обновление:

Я не совсем уверен, почему это не приходило мне в голову раньше, но, как упоминалось в ответе, ключ к нему как ксовершенно другой контент для инъекций.Предполагая, что вам не нужно никакого взаимодействия через границу iframe (что все еще может быть достигнуто с помощью передачи сообщений), вы можете просто изменить манифест, как показано ниже.Ключ соответствует источнику iframe, а не источнику страницы.Строка "all frames: true имеет важное значение, поскольку по умолчанию кадры, которые не являются самыми верхними, не будут сопоставлены.

manifest.json

{
    //...
    "content_scripts": [
        {
            "all_frames": true,
            "matches": [
                "https://static.example.com/.../player.html"
            ],
            "js": [
                "inject.js"
            ]
        }
    ],
    //...
}

1 Ответ

0 голосов
/ 01 декабря 2018

Важным выводом здесь является следующее предложение:

Для дополнительной информации document.querySelector ("iframe"). Src возвращает https://static.example.com/.../player.html. "Происхождение" отличается, нотот же корневой домен исходного сайта.

Происхождение отличается. (static.example.com! = example.com) Даже если корневой домен одинаков,происхождение не .(Вот почему tuckerchapin.sketchyfreewebhost.com не может обслуживать и изменять содержимое с сайта j6m8.sketchyfreewebhost.com).Так что, теоретически, это «лучшее» поведение.

Взято из этого ответа :

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

(выделено мной)

...