1

Estoy tratando de leer un archivo TXT con javascript por medio de un botón usando addEventListener.

Éste es mi código:

document.querySelector('#boton').addEventListener('click', extraerDatos);

function extraerDatos(){


    const xhttp = new XMLHttpRequest();
    xhttp.open('GET', 'prueba.txt', true); 

    xhttp.send();
    xhttp.onreadystatechange = function(){
        if(this.readyState == 4 && this.status == 200){
            //console.log(this.responseText);
        documento.querySelector('#respuesta').innerHTML = this.responseText;
        }

    }
}

Y en Chrome me da este error:

Access to XMLHttpRequest at 'file:///C:/Users/Victor%20Alvarez/Desktop/COMP/leer/prueba.txt' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.

¿Qué debo hacer para que me permita leer el txt?

9
  • Hola Victor, te recomiento usar un servidor http simple. De lo contrario el protocolo file:/// te dará problemas.
    – Klaimmore
    Commented el 13 may. 2020 a las 6:00
  • Gracias, me adelanté a eso y usé http-server. ahora tengo este error: Failed to load resource: the server responded with a status of 404 (Not Found)
    – Victor A.
    Commented el 13 may. 2020 a las 6:05
  • 1
    Ahi ya no tienes un problema de CORS. Tienes que verificar que la URL sea la correcta, 404 indica que no lo es.
    – Klaimmore
    Commented el 13 may. 2020 a las 6:08
  • Ya accediendo a la ip del servidor intenté nuevamente y obtuve este:javas.js:15 Uncaught ReferenceError: documento is not defined at XMLHttpRequest.xhttp.onreadystatechange (javas.js:15)
    – Victor A.
    Commented el 13 may. 2020 a las 6:10
  • 2
    documento no es un elemento existente, existe es document, quitale la o.
    – Layer
    Commented el 13 may. 2020 a las 6:13

1 respuesta 1

2

El necesario usar un servidor HTTP pues, como decía @Klaimmore, el protocolo file:/// dará problemas de CORS (Intercambio de Recursos de Origen Cruzado).

Para instalar un servidor HTTP usé el paquete http-server de NPM.

Para ello instalé NPM: https://npmjs.com/get-npm

Después de descargarlo se ejecutan las instrucciones:

node -v
npm -v

Para verificar que estén instalados Nodejs y NPM.

Luego:

npm install http-server -g

Para montar el servidor y después hice un cd [la ruta donde está el fichero] con mis documentos .js, .html y demás y sobre esa ruta ejecuté http-server y la IP que me asigna será la que almacene mi html que lee el archivo TXT inicial.

1
  • He hecho un par de mejoras en tu respuesta para que la respuesta sea de mayor utilidad. Commented el 13 may. 2020 a las 6:38

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.