El elemento le permite incrustar otras páginas web directamente en su página web. Pero cuando se usan iframes hay algunos problemas de seguridad y diseño que no fueron tratados en HTML 4.01. HTML5 aporta tres nuevos atributos a este elemento para ayudar a abordar estas preocupaciones:
Índice de contenidos
El atributo «sandbox»
El atributo «sandbox» del elemento «IFRAME» es una característica de seguridad muy útil de los iframes. Cuando lo coloca en un elemento de IFRAME, está indicando al agente de usuario que no permita las funciones que puedan causar un riesgo de seguridad para el sitio y sus usuarios.
Por ejemplo:
sandbox="">
Indica al navegador que no permita todas las funciones que puedan suponer un riesgo para la seguridad. Específicamente, los plugins no están permitidos. No se pueden enviar formularios. Los scripts no se ejecutarán y los enlaces fuera del IFRAME no están permitidos. Por último, no se permite el acceso a las cookies, al almacenamiento local y a otras páginas del mismo dominio (origen).
Luego, utilizando los valores de la palabra clave «sandbox», puede volver a habilitar algunas de las funciones. Estas palabras clave son:
allow-formsAllow form submission. permitir-el-mismo-origenPermitir a los scripts acceder al contenido como cookies desde el mismo dominio de origen. allow-scriptsAllow scripts to run in this IFRAME. allow-top-navigationAllow the IFRAME links and scripts to the «_top» target
No es una buena idea establecer las palabras clave «allow-scripts» y «allow-same-origin» juntas en el mismo IFRAME. Si hace esto, la página incrustada puede entonces eliminar completamente el atributo «sandbox», negando cualquier beneficio de seguridad.
El atributo «srcdoc»
El atributo «srcdoc» es un atributo que da al diseñador web más control sobre los iframes y más seguridad. En lugar de enlazar a una página Web con una URL diferente, el diseñador web coloca el HTML que se va a mostrar en un IFRAME dentro del atributo «srcdoc».
Al principio, podrías estar pensando, «¿En qué se diferencia esto de poner el HTML en la página?» Y de alguna manera, no es terriblemente diferente. Pero hay que tener en cuenta una de las funciones del elemento IFRAME, que es mantener los datos no confiables separados del resto del sitio.
Colocando HTML creado por una fuente no fiable, como un formulario, en un IFRAME, se puede «sandboxear» el contenido no fiable y seguir mostrándolo en la página. Los comentarios del blog son un ejemplo. La mayoría de los blogs tienen sólo un número limitado de etiquetas HTML que los comentaristas pueden usar en sus comentarios. Pero al colocar esos comentarios en un IFRAME en una caja de arena usando el atributo «srcdoc», los comentarios pueden ser más robustos a la vez que protegen el sitio en su conjunto.
Seguridad e Iframes
Los dos atributos anteriores proporcionan seguridad para sus elementos IFRAME, pero no son una prueba contra todos los sitios maliciosos. Si el sitio malicioso puede convencer a un usuario de que acceda directamente al contenido hostil (por ejemplo, escribiendo la URL en su navegador), todavía puede ser atacado.
Si es posible, lo mejor es establecer el contenido que se encuentra en el IFRAME en la caja de arena como el tipo «text/html-sandboxed» MIME.
El atributo «seamless»
El atributo «seamless» es un atributo booleano que indica al navegador que muestre el IFRAME como si fuera parte del documento padre. Si desea que su IFRAME se muestre sin problemas, simplemente incluya este atributo en el elemento:
Pero hacer que el IFRAME sea impecable es más que sólo el aspecto, también es la forma en que la página interactúa con el marco. Por ejemplo:
Los enlaces en el IFRAME se abrirán en la ventana principal a menos que la página del IFRAME tenga el destino «_SELF» establecido.
CSS en el IFRAME se añadirá a la cascada de todo el documento.
El elemento raíz de la página de IFRAME se considera un hijo de IFRAME.
La anchura y la altura del IFRAME se establecen de forma similar a como se establecerían otros elementos a nivel de bloque.
Cuando el documento padre es visto por una herramienta de representación de voz como un lector de pantalla, el IFRAME se lee sin anunciarlo como un documento separado.
Cualquier script en el documento padre afectaría al documento IFRAME de la misma manera. Por ejemplo, si un script listara todos los marcos de la página, los enlaces en el IFRAME también estarían listados.
En otras palabras, el atributo «seamless» hace mucho más que simplemente eliminar los bordes del IFRAME. Si va a configurar un IFRAME para que sea perfecto, debe estar muy seguro del contenido para no añadir ningún riesgo de seguridad a su sitio web mediante la incorporación de un sitio malicioso.
