Веб-сообщения

Веб-сообщения или обмен сообщениями между документами — это API, представленный в проекте спецификации WHATWG HTML5 , позволяющий документам взаимодействовать друг с другом из разных источников или исходных доменов. ^[1] при рендеринге в веб-браузере . До появления HTML5 веб-браузеры запрещали межсайтовый скриптинг для защиты от атак безопасности. Эта практика также запрещала общение между невраждебными страницами, что затрудняло любое взаимодействие с документами. ^[1]^[2] Обмен сообщениями между документами позволяет сценариям взаимодействовать через эти границы, обеспечивая при этом элементарный уровень безопасности.

Требования и атрибуты

Использование API обмена сообщениями postMessage Метод простого текстового сообщения может быть отправлен из одного домена в другой, например, из родительского документа в IFRAME . ^[3] Для этого автору необходимо сначала получить Window объект принимающего документа. В результате сообщения могут быть отправлены по следующим адресам: ^[2]

другие фреймы или iframe в окне документа отправителя
Windows: документ отправителя явно открывается с помощью вызовов JavaScript
родительское окно документа отправителя
окно, в котором открылся документ отправителя

Сообщение event будучи полученным, имеет следующие атрибуты:

data – Данные или фактическое содержание входящего сообщения.
origin – Происхождение документа отправителя. Обычно это включает в себя схему, имя хоста и порт. Он не включает идентификатор пути или фрагмента. ^[1]
source - WindowProxy откуда взялся документ (исходное окно).

postMessage не является блокирующим вызовом; сообщения обрабатываются асинхронно. ^[4]

Пример

Предположим, мы хотим, чтобы документ A был загружен из example.net для связи с документом B, загруженным из example.com в iframe или всплывающее окно. ^[1] JavaScript для документа A будет выглядеть следующим образом:

var o = document.getElementsByTagName('iframe')[0];
o.contentWindow.postMessage('Hello B', 'http://example.com/');

Происхождение нашего contentWindow объект передается postMessage. Он должен соответствовать origin документа, с которым мы хотим связаться (в данном случае, документа B). В противном случае будет выдана ошибка безопасности и скрипт остановится. ^[3] JavaScript для документа B будет выглядеть следующим образом:

function receiver(event) {
    if (event.origin == 'http://example.net') {
        if (event.data == 'Hello B') {
            event.source.postMessage('Hello A, how are you?', event.origin);
        }
        else {
            alert(event.data);
        }
    }
}
window.addEventListener('message', receiver, false);

Прослушиватель событий настроен на получение сообщений из документа A. Используя origin свойство, затем он проверяет, является ли домен отправителя ожидаемым доменом. Затем документ B просматривает сообщение, либо отображая его пользователю, либо отвечая, в свою очередь, собственным сообщением для документа A. ^[1]

Безопасность

Плохая проверка происхождения может представлять риск для приложений, использующих обмен сообщениями между документами. ^[5] Чтобы защититься от вредоносного кода с иностранных доменов, авторам следует проверить origin атрибут, гарантирующий, что сообщения принимаются из доменов, от которых они ожидают получать сообщения. Также следует проверить формат входящих данных на соответствие ожидаемому формату. ^[1]

Поддерживать

Поддержка обмена сообщениями между документами существует в текущих версиях Internet Explorer , Mozilla Firefox , Safari , Google Chrome , Opera , Opera Mini , Opera Mobile и веб-браузера Android . ^[6] Поддержка API существует в механизмах компоновки Trident , Gecko , WebKit и Presto . ^[7]

См. также

Ссылки

^ Jump up to: ^а ^б ^с ^д ^и ^ж Междокументный обмен сообщениями – проект стандарта HTML
^ Jump up to: ^а ^б Темы по программированию WebKit DOM — обмен междокументными сообщениями ^{[ мертвая ссылка ]}
^ Jump up to: ^а ^б Реми, Шарп, Сообщения, рабочие процессы и сокеты , Знакомство с HTML5 , New Riders, 2011, стр. 197-199
^ «Веб-сообщения HTML5» .
^ Коротко о безопасности HTML5
^ Когда я могу использовать обмен междокументными сообщениями?
^ Подборка поддерживаемых функций в HTML5. ^{[ мертвая ссылка ]}

Внешние ссылки

Рекомендации по обмену веб-сообщениями HTML5
Спецификация веб-сообщений HTML5
Междокументный обмен сообщениями — проект стандарта HTML , WHATWG
Темы по программированию WebKit DOM — междокументный обмен сообщениями , библиотека разработчиков Apple, заархивировано из оригинала 09 июня 2012 г. , получено 29 декабря 2013 г.
Энг, Крис (17 мая 2010 г.), Коротко о безопасности HTML5 , Veracode
Когда я могу использовать обмен междокументными сообщениями? , МогуИспользовать
Выбор поддерживаемых функций HTML5

[WHATWG-1] Jump up to: ^а ^б ^с ^д ^и ^ж Междокументный обмен сообщениями – проект стандарта HTML

[WebKit-2] Jump up to: ^а ^б Темы по программированию WebKit DOM — обмен междокументными сообщениями ^{[ мертвая ссылка ]}

[INTRODUCING-3] Jump up to: ^а ^б Реми, Шарп, Сообщения, рабочие процессы и сокеты , Знакомство с HTML5 , New Riders, 2011, стр. 197-199

[4] «Веб-сообщения HTML5» .

[Security-5] Коротко о безопасности HTML5

[canIuse-6] Когда я могу использовать обмен междокументными сообщениями?

[SUPPORT-7] Подборка поддерживаемых функций в HTML5. ^{[ мертвая ссылка ]}

[1]

[2]

[3]

[4]

[5]

[6]

[7]