Soy nuevo en Javascript y estoy aprendiendo los conceptos básicos a través de un libro de texto que se enfoca en sus aplicaciones en IE 7+ y Firefox 2+. Sin embargo, estoy usando Chrome y recibo el siguiente error cuando ejecuto el programa dado en el libro: "bloqueó un marco de origen 'nulo' para que no acceda a un marco de origen cruzado". ¿Alguien puede decirme qué está causando el error y cómo puedo solucionarlo? Los dos programas están abajo.
//This is the program being loaded into the browser <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Example</title> <script type="text/javascript"> function calcFactorial(factorialNumber){ var factorialResult = 1; for(;factorialNumber>0;factorialNumber--) factorialResult *= factorialNumber; return factorialResult; } </script> </head> <frameset cols="100%,*"> <frame name="fraCalcFactorial" src="calcfactorial.htm"/> </frameset> </html>A continuación se muestra el archivo src
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Example</title> <script type="text/javascript"> function butCalculate_onclick(){ try{ if (window.top.calcFactorial == null) throw "This page is not loaded within the correct frameset"; if (document.form1.txtNum1.value == "") throw "!Please enter a value before you calculate its factorial"; if (isNaN(document.form1.txtNum1.value)) throw "!Please enter a valid number"; if (document.form1.txtNum1.value < 0) throw "!Please enter a positive number"; } catch(exception){ if (typeof(exception) == "string"){ if (exception.charAt(0) == "!"){ alert(exception.substr(1)); document.form1.txtNum1.focus(); document.form1.txtNum1.select(); } else alert(exception); } else alert("The following error occurred: " + exception.message); } } </script> </head> <body> <form action="" name="form1"> <input type="text" name="txtNum1" size="3" /> factorial is <input type="text" name="txtResult" size="25" /><br/> <input type="button" value="Calculate Factorial" name="butCalculate" onclick="butCalculate_onclick()" /> </form> </body> </html>Esto sucede porque Chrome no permite que los marcos de su disco duro accedan al contenido de los demás. Lo que, técnicamente, denominamos solicitud de origen cruzado.
La solución del problema anterior es:
1. O aloja su página web en un servidor web local. Ver el siguiente enlace:
¿Cuál es una alternativa más rápida al http.server de Python (o SimpleHTTPServer)?
2. Usa cualquier otro navegador como Firefox
Si usa Visual Studio Code, puede instalar una extensión llamada "Live Server". Me ayudó cuando tuve el mismo problema.
Si no desea utilizar un servidor web local como se sugiere en la respuesta aceptada, puede ejecutar el navegador con cross domain web security / same origin policy deshabilitada.
Para cromo :
Deshabilitar la misma política de origen en Chrome
Para Firefox :
Deshabilitar la seguridad web entre dominios en Firefox
https://addons.mozilla.org/en-US/firefox/addon/access-control-allow-origin/
Debido a la solicitud 'Cross-origin', se produce el error 'blocked a frame with origin "null" from access a cross-origin frame'. Hay varias soluciones para este problema, como utilizar un "servidor web local" o usar un navegador con la "seguridad web entre dominios" desactivada, por nombrar algunas. Este artículo repasa todas las opciones para tratar las inquietudes de origen cruzado.
Consulte este enlace:
https://kodlogs.net/195/blocked-a-frame-with-origin-null-from-accessing-a-cross-origin-frame