iframes - iframe php javascript

Javascript, track iframes redireccionando ventana superior

Question

Dado que no hay forma de evitar que un iframe redirija el marco superior además del sandbox, lo que evita otras funciones requeridas para el seguimiento de la visibilidad. Me gustaría realizar un seguimiento de los redireccionamientos. Dado que un sitio puede tener más de un iframe, podría ser cualquiera de estos.

¿Hay alguna forma de rastrear / averiguar cuál (iframe específico) causó la redirección del marco superior?

Aquí hay una caja de arena (use la consola del navegador y active el registro de conservación):

Tenga en cuenta que el contenido de iframe suele ser de dominio cruzado. Para facilidad de uso está dentro del sandox.

Answer 1

Desde los iframes individuales, ¿puede configurar una cookie cuando ocurre la redirección? Digamos que sucedió desde iframe1, puede establecer una cookie como

document.trackFrame = "FrameName=iframe1";  

Y una vez que se completa el redireccionamiento, ¿puedes intentar leer la cookie y determinar qué iframe causó la redirección?

Answer 2

Podemos acceder al contenido de iframe con algo como iframe.contentWindow.document pero esto es posible si observamos la política del mismo origen .

Otro enfoque podría ser establecer un encabezado de Content-Security-Policy como:

<meta http-equiv="Content-Security-Policy" content="frame-src http://example.com">

Este encabezado en la página principal impide cargar sitios diferentes a http://example.com en marcos. También hay una forma de report el comportamiento de rechazo enviando una publicación, pero desafortunadamente no se puede configurar con la etiqueta <meta> (solo es lado del servidor). Con este enfoque tenemos que realizar una lista blanca, así que creo que quizás no sea útil en este caso. Pero, si se da la lista blanca por primera vez, es posible configurar todos los sitios disponibles, por lo que cuando se redirige el iframe, el navegador se negará a cargarla.

Si no es el caso del mismo origen y la posibilidad de realizar una lista blanca, entonces creo que lo mejor que podemos hacer es llamar onunload evento iframe onunload , desafortunadamente este evento se onunload también cuando la página iframe se vuelva a cargar no solo en la redirección. Creo que es el enfoque más cercano. Para lograrlo, este código funciona.

var srcs = ["iframe2.html","iframe.html","iframe2.html"];


        for (let i = 0; i < srcs.length; i++) {
            var iframe = document.createElement(''iframe''); 
                iframe.src = srcs[i]; 
                iframe.name = "i"+i; 
                document.body.appendChild(iframe);
                window["i"+i].onunload = function(){console.log("change "+i)}
        }

Por supuesto, la onunload se onunload la primera vez, cuando todos los iframes se cargan, las redirecciones son 2ª 3ª y así sucesivamente. Pero podríamos excluir ese primer caso.

Aquí un ejemplo completo https://codesandbox.io/s/o16yk7mqy , he creado iframe3.html que no se actualiza ni se vuelve a cargar para mostrar claramente el punto. También he creado una lista simple de redirigir o recargar iframes.

ACTUALIZACIÓN Como entiendo ahora, lo que desea es establecer iframes con propiedad de sandbox y una lista blanca de todo lo que desea, pero sin allow-top-navigation , algo como:

<iframe src="iframe.html" sandbox="allow-script allow-forms allow-popups allow-pointer-lock allow-same-origin"></iframe>

• Este ejemplo no permite allow-top-navigation https://codesandbox.io/s/lpmv6wr6y9
• Este ejemplo aquí https://codesandbox.io/s/4x8v1mojq7 permite allow-top-navigation pero codesandbox evita que el marco se redirija, así que si intentamos https://4x8v1mojq7.codesandbox.io/ que es la url creada por codesandbox , Podía ver la recarga del cuadro superior.

Como dije en los comentarios, al menos Chrome 64.0.3282.167, cuando delegamos todos excepto permitir la navegación superior cuando el iframe intenta redirigir el marco superior, produce una excepción. El comportamiento es diferente en Firefox (al menos 58.0.2). Firefox niega la navegación superior pero continúa con el código.

Entonces, como conclusión, el mejor enfoque en mi opinión es una combinación de sanbox y onunload o solo onload. Por supuesto, si es posible, la Política de seguridad de contenido es la forma más segura y flexible. Depende de la implementación. Creo que es casi imposible no involucrar el código del lado del servidor para realizar una solución perfecta. Hay una lista blanca para verificar, como esta API https://developers.google.com/safe-browsing/v4/ y hay una lista negra para revisar, consulte esta publicación https://security.stackexchange.com/questions/32058/looking-for-url-blacklists-of-malicious-websites .

Answer 3

Puede mostrar un cuadro de diálogo antes de redirigir a otro dominio / aplicación y luego el usuario puede decidir si desea quedarse o abandonar la aplicación actual. También puede hacer un seguimiento del objetivo actual (es decir, iframe en su caso).

window.onbeforeunload = function (e) {
  console.log(e.currentTarget.location.href);
  return ''Stop redirection. Show dialog box.'';
};

Answer 4

Si tiene control sobre todos sus marcos, puede implementar la interacción entre marcos con postMessage . Fluir:

1. El marco desea ejecutar la redirección: envía un mensaje al marco principal con una solicitud de redirección.
2. El cuadro principal que ejecuta la redirección y sabe qué marco causó una redirección

Padre:

window.addEventListener("message", (event) => {
    // show message source (your frame)
    console.log(event.source);

    const message = event.data;
    console.log(`Frame ID: ${message.frameId}`);

    if(message.messageType === "redirect") {
        window.location.href = message.redirectUrl;
    }
});

Marco infantil:

function redirect(url) {
    var message = {
        messageType: "redirect",
        frameId: "frame1"
        redirectUrl: url
    }
    window.parent.postMessage(message, "*");
}