web-dev-qa-db-fra.com

Enregistrement de l'entrée de fichier sous forme de données binaires FileReader via AJAX Poster

J'essaie de publier une pièce jointe dans un fichier HTML saisi dans une page Web via une API Rest. La documentation de l'API indique que la publication est un contenu directement binaire en tant que corps de la requête HTTP, pas un téléchargement de fichier de formulaire.

Mon code est le suivant:

$('#_testButton').bind('click', function () {
    var file = document.getElementById('_testFile').files[0]
    var reader = new FileReader();
    reader.onload = function () {
        $.ajax({
            url: '/attachmentURL',
            type: 'POST',
            data: reader.result
        })
    }
    reader.readAsBinaryString(file)
})

J'ai besoin que cela fonctionne pour un certain nombre de mimeTypes différents, donc je ne l'ai pas déclaré dans le code ci-dessus. Cependant, j'ai essayé de déclarer contentType: 'application/msword' pour un fichier .doc et j'ai également essayé processData: false et contentType: false.

Les données sont affichées où il le faut. Cependant, lorsque j'ouvre le fichier, je reçois un message disant: mimeType: application/x-empty avec un fichier vide OR, un fichier contenant plusieurs caractères binaires. J'ai essayé des fichiers .doc et un pdf et le résultat est le même pour les deux.

Quelqu'un at-il une idée de ce que je peux changer pour que cela fonctionne?

jqueryajaxrestfilereader
25
Eric H.

Envoyer simplement la référence file sous forme de données (avec processData: false) a au moins effectué le travail pour moi:

$('#_testButton').bind('click', function () {
    var file = document.getElementById('_testFile').files[0];

    $.ajax({
        url: "/attachmentURL",
        type: "POST",
        data: file,
        processData: false
    });
});

Il est décrit ici: https://developer.mozilla.org/en/DOM/XMLHttpRequest/Sending_and_Receiving_Binary_Data#section_3

L'envoi d'une chaîne (même si cette chaîne représente des données binaires) ne fonctionnera pas car le navigateur la transformera de force en unicode et encodera en tant que utf-8 comme spécifié , ce qui corrompra les données binaires:

Si data est une chaîne, codons en UTF-8.

Soit le type mime "text/plain; charset = UTF-8".

Laissez le corps d'entité de la demande être converti en données Unicode et codé comme UTF-8.

Envoyer une référence file (blob) fera ceci:

Si data est un blob Si l'attribut type de l'objet n'est pas vide string laissez le type mime être sa valeur.

Laissez le corps d'entité de la demande être les données brutes représentées par des données.

31
Esailija

fichier var;

        $('#_testFile').on("change", function (e) {
            file = e.target.files[0];
        });
        $('#_testButton').click(function () {
            var serverUrl = '/attachmentURL';

            $.ajax({
                type: "POST",
                beforeSend: function (request) {
                    request.setRequestHeader("Content-Type", file.type);
                },
                url: serverUrl,
                data: file,
                processData: false,
                contentType: false,
                success: function (data) {
                    console.log("File available at: ", data);
                },
                error: function (data) {
                    var obj = jQuery.parseJSON(data);
                    alert(obj.error);
                }
            });
        });
1
masoud soroush