tengo un problema que nose como solucionar, necesito consultar un archivo Json desde una pagina en html con javascript pero no lo logro, es para un proyecto.
dejo aqui el codigo que estoy usando en Html
Código
<!DOCTYPE html> <html> <head> <link rel="stylesheet" type="text/css" href="estilo.css"> <link href="https://fonts.googleapis.com/css?family=Lato" rel="stylesheet"> <script type="text/javascript"> function lee_json() { $.getJSON("c:/datos.json", function(datos) { alert(datos["Serie"]); console.add(datos["Serie"]); }); } </script> </head> <body onload="lee_json();"> <header id="encabezado"> <div id="mainheader" > <div class="logo izquierda"> <img src="images/logo.png"> </div> </div> <div id="busqueda"> <input type="text" placeholder="Busqueda"> </div> </header> <aside id="contenido"> <div> <input type="text" placeholder="Serie" style="float: left;margin-left:40px; margin-bottom: 20px;"> <input type="text" placeholder="Nombre de equipo" style="margin-left:100px;" > <input type="text" placeholder="Activo" style=" margin-left:100px;"> <input type="text" placeholder="Modelo" style="margin-left:100px;"> <input type="text" placeholder="Ubicacion" style="margin-left:100px;"> <input type="text" placeholder="Persona responsable" style="float: left;margin-left:40px; margin-bottom: 20px;"> <input type="text" placeholder="Departamento" style="margin-left:100px;"> <input type="text" placeholder="Expiracion" style="margin-left:100px;"> <input type="text" placeholder="Sistema Operativo" style="margin-left:100px;"> <input type="text" placeholder="Descripcion" style="margin-left:100px;"> </div> </aside> <aside id="final"> <div class="logo2 izquierda"> <img src="images/logo.png" /> </div> <div class="botones"> </div> </aside> </body> </html>
luego el codigo en CSS.
Código
body{ /* Elimina borde por defecto del navegador */ margin:0; padding: 0; font-family: 'Lato', sans-serif; font-size: 16px; } .clear{ /*limpia los margenes*/ margin:0; padding: 0; height: 0; clear: both; } .izquierda{ /*acomoda lo que deseo al lado izquierdo del elemento deseado*/ float: left; } .derecha{ /*acomoda lo que deseo al lado derecho del elemento deseado*/ float: right; } #busqueda{/*acomoda el cuadro de busqueda*/ float: right; width: 210px; margin-right: 160px; margin-top: 35px; } #encabezado{ /*edita la parte superior de la pagina*/ height:80px; background-color:#c3c3c3; } .logo img{ /*ajusta el logo del encabezado al tamaño y posicion que deseo*/ width: 250px; margin-left: 160px; margin-top: 0px; } #contenido{ /*edita todo el cuadro del contenido*/ height: 360px; background-position: center; padding: 47px; border: 1px solid black; } #final{ /*edita la parte inferior de la pagina*/ margin-top:0px; background-color:#c3c3c3; height: -10px; background-position: center; padding: 50px; } .logo2 img{ /*ajusta el logo del final al tamaño y posicion que deseo*/ width: 200px; margin-left: -20px; margin-top: -40px; } .botones{ display:flex; margin: -30px auto; width: 60%; }
y por ultimo el Json
Código
[ { "Serie1": "5CG53446JS", "Nombre de equipo": "PAN2146JSL", "activo": "646", "Modelo": " HP ProBook 640 G1", "Ubicación": "Panamá", "Persona responsable": " Aida Medina", "Departamento": "21", "Expiracion": "29/08/2015", "Sistema Operativo": "W10 ENT x64", "Descripcion": "prueba" }, { "Serie": "5CG50936BF", "Nombre de equipo": "CR3036BFL", "activo": "556", "Modelo": " HP ProBook 640 G1", "Ubicación": "Evertec Tournon", "Persona responsable": "Aaron Cordoba", "Departamento": "30", "Expiracion": "11/03/2015", "Sistema Operativo": "W10 ENT x64", "Descripcion": "prueba1" }, { "Serie": "5CG50936BF", "Nombre de equipo": "CR3036BFL", "activo": "556", "Modelo": " HP ProBook 640 G1", "Ubicación": "Evertec Tournon", "Persona responsable": "diego", "Departamento": "30", "Expiracion": "11/03/2015", "Sistema Operativo": "W10 ENT x64", "Descripcion": "prueba1" }, { "Serie": "5CG50936BF", "Nombre de equipo": "CR3036BFL", "activo": "556", "Modelo": " HP ProBook 640 G1", "Ubicación": "Evertec Tournon", "Persona responsable": "Steven", "Departamento": "30", "Expiracion": "11/03/2015", "Sistema Operativo": "W10 ENT x64", "Descripcion": "prueba1" }, { "Serie": "5CG50936BF", "Nombre de equipo": "CR3036BFL", "activo": "556", "Modelo": " HP ProBook 640 G1", "Ubicación": "Evertec Tournon", "Persona responsable": "ale", "Departamento": "30", "Expiracion": "11/03/2015", "Sistema Operativo": "W10 ENT x64", "Descripcion": "prueba1" }, { "Serie": "" } ]
estoy tratando de al menos hacer la conexion con el archivo que lance una alerta pero en consola me muestra el siguiente error
jquery.min.js:2 Access to XMLHttpRequest at 'file:///C:/datos.json' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.
gracias de antemano, soy principiante y me gustaria un poco de ayuda.
Saludos,