example - xmlhttprequest json

Crear un archivo a partir de una respuesta de objeto XMLHttpRequest

Question

En primer lugar, permítanme pedir disculpas si nada de lo que voy a decir tiene sentido. Estoy fuera de mi zona de confort aquí y realmente no sé lo que estoy haciendo. Con eso dicho...

Estoy usando la biblioteca del selector de archivos de Google Drive para permitir que los usuarios carguen su CV de Google Drive.

function downloadGDriveFile(file) {
    if (file.downloadUrl) {
        var accessToken = gapi.auth.getToken().access_token;
        var xhr = new XMLHttpRequest();
        xhr.open(''GET'', file.downloadUrl);
        xhr.setRequestHeader(''Authorization'', ''Bearer '' + accessToken);
        xhr.onload = function () {
            var content = xhr.response;
            console.log(xhr);

            form_element = document.getElementById("new_guest_application");
            form_data = new FormData(form_element);
            new_file = new File([content], file.title, {type: file.mimeType});
            form_data.append(''guest_application[curriculum_vitae]'', new_file);
            console.log(new_file);

            var request = new XMLHttpRequest();
            request.open("POST", form_element.action);
            request.send(form_data);

        };
        xhr.onerror = function () {
            alert(''Download failure.'');
        };
        xhr.send();
    }
    else {
        alert(''Unable to download file.'');
    }
}

Usando el código anterior, estoy aceptando el objeto de file seleccionado y usándolo, junto con el token de encabezado relevante, para descargar el content del archivo. Esto parece estar funcionando según lo previsto.

Mi problema surge cuando trato de convertir dicho contenido en un File para adjuntarlo a un formulario y enviarlo a mi servidor.

El código anterior funciona, en la medida en que el servidor acepte un archivo y se cargue en consecuencia, pero dicho archivo está dañado. Me imagino que esto es porque estoy haciendo algo mal con el file = new File([content], file.title, {type: file.mimeType}); línea, pero estoy tan lejos de mi zona de confort, que ni siquiera sé por dónde empezar.

(No hago mucho JavaScript como regla, y solo he logrado llegar tan lejos con una buena dosis de prueba y error de prueba y error)

¿Alguien me puede ayudar? Gracias.

Answer 1

xhr.response devolverá algunos datos formateados según el tipo de datos definido en xhr.responseType . Si lleva datos binarios y responseType está establecido en un tipo de texto, sus datos se dañarán.

Puede intentar anular xhr.responseType justo antes de leer la respuesta

xhr.responseType = "arraybuffer";
var content = xhr.response;