Comprensión de los nuevos elementos’IFRAME’ en HTML5

Comprensión de los nuevos elementos’IFRAME’ en HTML5

Comprensión de los nuevos elementos’IFRAME’ en HTML5

VALORACIÓN DEL ARTÍCULO:
5/5


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.

TAMBIÉN TE INTERESA

Zenfone-11-Ultra

Zenfone 11 Ultra, que siga la fiesta de la IA en los smartphones

Todos los últimos lanzamientos de smartphones están marcados por la inteligencia artificial. Este hecho, que ocupa los titulares de hoy, se está convirtiendo en un estándar y pronto dejará de ser noticia. Pero no estos momentos es la novedad y la transformación hacia la que caminan todas las marcas del mercado. Así lo ha hecho

Enco-Buds2-Pro

Enco Buds2 Pro: unos auriculares buenos, bonitos, baratos e inteligentes

Por menos de 50 euros, los auriculares OPPO Enco Buds2 Pro pueden darnos todo lo que necesitamos para nuestro día a día. ¿Por qué? Porque son una combinación excepcional de calidad de sonido, duración de batería extendida y un diseño moderno y funcional. Además cuentan con funciones inteligentes y dan a los usuarios la libertad

Xiaomi-14-Series

Xiaomi 14 Series se suma a la puja por ser el móvil del año

Xiaomi 14 Series llega al mercado para colarse en la eterna batalla que mantienen los flagships de Apple y Samsung. Al igual que sus rivales, los nuevos móviles de la marca china llegan con la IA bajo el brazo y una gran cantidad de razones para aspirar a ser uno de los móviles del 2024.