Estoy tratando de escribir un lector de archivos de texto simple mediante la creación de una función que toma la ruta del archivo y convierte cada línea de texto en una matriz de caracteres, pero no funciona.
function readTextFile() { var rawFile = new XMLHttpRequest(); rawFile.open("GET", "testing.txt", true); rawFile.onreadystatechange = function() { if (rawFile.readyState === 4) { var allText = rawFile.responseText; document.getElementById("textSection").innerHTML = allText; } } rawFile.send(); }¿Qué está fallando aquí?
Esto todavía no parece funcionar después de cambiar un poco el código de una revisión anterior y ahora me está dando una excepción XMLHttpRequest 101.
Probé esto en Firefox y funciona, pero en Google Chrome simplemente no funciona y me sigue dando una Excepción 101. ¿Cómo puedo hacer que esto funcione no solo en Firefox, sino también en otros navegadores (especialmente Chrome )?
Debe verificar el estado 0 (ya que al cargar archivos localmente con XMLHttpRequest , no obtiene un estado devuelto porque no es de un Webserver )
function readTextFile(file) { var rawFile = new XMLHttpRequest(); rawFile.open("GET", file, false); rawFile.onreadystatechange = function () { if(rawFile.readyState === 4) { if(rawFile.status === 200 || rawFile.status == 0) { var allText = rawFile.responseText; alert(allText); } } } rawFile.send(null); } Y especifique file:// en su nombre de archivo:
readTextFile("file:///C:/your/path/to/file.txt");Después de la introducción de fetch api en javascript, leer el contenido de los archivos no podría ser más sencillo.
leyendo un archivo de texto
fetch('file.txt') .then(response => response.text()) .then(text => console.log(text)) // outputs the content of the text fileleyendo un archivo json
fetch('file.json') .then(response => response.json()) .then(jsonResponse => console.log(jsonResponse)) // outputs a javascript object from the parsed jsonEsta técnica funciona bien en Firefox , pero parece que la implementación de
fetchde Chrome no es compatible con el esquema de URLfile:///en la fecha de redacción de esta actualización (probado en Chrome 68).
Esta técnica no funciona con Firefox superior a la versión 68 (9 de julio de 2019) por el mismo motivo (de seguridad) que Chrome:
CORS request not HTTP. Consulte https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS/Errors/CORSRequestNotHttp .
Visita Javascripture ! Y ve a la sección readAsText y prueba el ejemplo. Podrás saber cómo funciona la función readAsText de FileReader .
<html> <head> <script> var openFile = function(event) { var input = event.target; var reader = new FileReader(); reader.onload = function(){ var text = reader.result; var node = document.getElementById('output'); node.innerText = text; console.log(reader.result.substring(0, 200)); }; reader.readAsText(input.files[0]); }; </script> </head> <body> <input type='file' accept='text/plain' onchange='openFile(event)'><br> <div id='output'> ... </div> </body> </html>