Понимание новых элементов IFRAME в HTML5

Элемент позволяет встраивать другие веб-страницы непосредственно в вашу веб-страницу. Но при использовании iframes существуют некоторые проблемы безопасности и дизайна, которые не были рассмотрены в HTML 4.01. HTML5 приносит три новых атрибута этому элементу, чтобы помочь решить эти проблемы:

Атрибут песочницы

песочница атрибут IFRAME элемент - очень полезная функция безопасности iframe. Когда вы поместите его в IFRAME элемент, вы поручаете пользовательскому агенту запретить функции, которые могут вызвать угрозу безопасности для сайта и его пользователей.

Например:

песочница = «» >

Сообщает обозревателю запретить все функции, которые могут представлять угрозу безопасности. В частности, плагины запрещены. Формы не могут быть отправлены. Сценарии не будут запускаться, а ссылки за пределами IFRAME не допускаются. Наконец, доступ к файлам cookie, локальному хранилищу и другим страницам в том же домене (происхождение) запрещен.

Затем, используя песочница значения ключевых слов, вы можете повторно включить некоторые функции. Эти ключевые слова:

Allow-формы-Подтверждение формы
позволяют-же-происхождения-Allow scripts для доступа к содержимому, например, файлы cookie из того же исходного домена
Allow-скрипты-Allow скрипты для запуска в этом IFRAME
позволяют-топ-навигации-Доказать IFRAME ссылки и скрипты на _Топ цель

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

Атрибут srcdoc

srcdoc атрибут - это атрибут, который дает Web-дизайнеру больше контроля над iframe, а также большую безопасность. Вместо того, чтобы ссылаться на веб-страницу с другим URL-адресом, веб-дизайнер помещает HTML-код, который должен отображаться в IFRAME внутри srcdoc приписывать.

Во-первых, вы можете подумать: «Как это отличается от размещения HTML прямо на странице?» И в некотором смысле это не так уж и плохо. Но вы должны иметь в виду одну из функций IFRAME элемент, который должен хранить ненадежные данные отдельно от остальной части сайта.

Поместив HTML, который создается ненадежным источником, таким как форма, в IFRAME вы можете «изолировать» недоверенный контент и по-прежнему отображать его на странице. Замечания блога - пример. В большинстве блогов есть только ограниченное количество тегов HTML, которые комментаторы могут использовать в своих комментариях. Но, разместив эти комментарии в песочнице IFRAME с использованием srcdoc атрибут, комментарии могут быть более надежными при сохранении сайта в целом.

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

Вышеуказанные два атрибута обеспечивают безопасность вашего IFRAME элементов, но они не являются доказательством против всех вредоносных сайтов. Если вредоносный сайт может убедить пользователя напрямую обращаться к враждебному контенту (например, набрав URL-адрес в своем браузере), они все равно могут быть атакованы.

Если возможно, лучше установить контент, который находится в изолированной IFRAME как текст / html-песочница MIME-тип.

Непрерывный атрибут

бесшовный атрибут - это логический атрибут, который указывает браузеру отображать IFRAME как если бы это было частью родительского документа. Если вы хотите IFRAME для отображения без проблем, просто включите этот атрибут в элемент:

бесшовный >

Но создание IFRAME бесшовные - это больше, чем просто внешний вид, а также то, как страница взаимодействует с фреймом. Например:

Ссылки в IFRAME откроется в родительском окне, если только IFRAME страница имеет цель _self задавать.
CSS в IFRAME будет добавлен в каскад всего документа.
Корневой элемент IFRAME страница считается ребенком IFRAME.
Ширина и высота IFRAME устанавливаются аналогично тому, как будут установлены другие элементы уровня блока.
Когда родительский документ просматривается инструментом речевой реплики, таким как экранный ридер, IFRAME будет читаться без объявления его в виде отдельного документа.
Любые скрипты на родительском документе повлияют на IFRAME документ таким же образом. Например, если скрипт перечислил все кадры на странице, ссылки в IFRAME также будут перечислены.

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