¿Cómo usar Javascript para leer un archivo de texto local y leer línea por línea?

83

Tengo una página web hecha por html + javascript que es una demostración, quiero saber cómo leer un archivo csv local y leer línea por línea para poder extraer datos del archivo csv.

litaoshen
fuente
2
¿Tiene algún requisito de compatibilidad con el navegador? específicamente, ¿es compatible con ie9 o menos?
No amado
@HunterLarco gracias, el problema es que no sé cómo sacar cada línea del resultado. Me refiero a reader.readAsText () devuelve todos los datos en lugar de que pueda leer línea por línea
litaoshen
@LukeMcGregor No hay requisitos, solo admitir las versiones actuales estará bien.
litaoshen

Respuestas:

116

Sin jQuery:

document.getElementById('file').onchange = function(){

  var file = this.files[0];

  var reader = new FileReader();
  reader.onload = function(progressEvent){
    // Entire file
    console.log(this.result);

    // By lines
    var lines = this.result.split('\n');
    for(var line = 0; line < lines.length; line++){
      console.log(lines[line]);
    }
  };
  reader.readAsText(file);
};

HTML:

<input type="file" name="file" id="file">

Recuerde poner su código javascript después de que se renderice el campo del archivo.

sitios
fuente
19
Tengo 200000 líneas (no es broma, es un archivo de registro). No creo que tu solución cubra eso, buen intento.
Tomáš Zato - Reincorpora a Monica
Además, esta solución no maneja si ese retorno (salto de línea) está dentro de un campo entre comillas. En cuanto a Tomas, si tienes un navegador más avanzado, puedes usar un generador para leer línea por línea sin hacer una "división".
Rahly
5
¿Dónde está la ruta del archivo externo en el que tomamos las líneas?
abidinberkay
La mina @ TomášZato tiene 100 metros de líneas. Sin embargo, todavía no he probado esa respuesta ... ¿Cómo lo abordaste? ¡Un enlace a un ejemplo sería muy apreciado! huanPastas, +1 por la respuesta!
gsamaras
2
@gsamaras No recuerdo exactamente, pero usé un flujo que lee los datos pieza por pieza y luego emita un evento por cada vez que me encuentro \n. Pero con 100 m de líneas, se encontrará con una tabla que las mostrará en HTML.
Tomáš Zato - Reincorporación a Monica
37

Usando ES6 el javascript se vuelve un poco más limpio

handleFiles(input) {

    const file = input.target.files[0];
    const reader = new FileReader();

    reader.onload = (event) => {
        const file = event.target.result;
        const allLines = file.split(/\r\n|\n/);
        // Reading line by line
        allLines.forEach((line) => {
            console.log(line);
        });
    };

    reader.onerror = (event) => {
        alert(event.target.error.name);
    };

    reader.readAsText(file);
}
JuJoDi
fuente
3
votó a favor de las líneas divididas con expresiones regulares, que es la forma correcta de hacerlo.
Meysam Feghhi
12
\r?\n
Regexp
1
Excelente ejemplo, y me encanta que se manejen los finales de línea estilo Windows y Unix. Gracias.
Brad