web-dev-qa-db-fra.com

Envoi de fichiers / téléchargement de fichiers en utilisant ajax qui fonctionne dans IE9

J'ai besoin de télécharger des fichiers en utilisant ajax qui doit être pris en charge dans IE9. J'utilisais FormData comme mentionné ici . Mon code ressemble à ceci:

var files = new FormData();
JQuery.each($('#file')[0].files, function (i, file) {
    files.append('file', file);
});

$.ajax({
    type: "POST",
    url: '/url',
    cache: false,
    contentType: false,
    processData: false,
    data: files,
    ...
});

Cela fonctionne bien dans Safari et Firefox, mais échoue dans IE9 car le FormData n'est pas pris en charge dans IE9. J'ai essayé d'envoyer juste en tant que fichier en définissant:

data: $('#file')[0].files[0]
contentType: 'multipart/form-data'

Cela échoue car les données sont envoyées sous forme codée par URL et ne peuvent pas être analysées du côté Java. Toute aide ou pointeur sur la façon de résoudre ce problème sera grandement apprécié. J'ai besoin de quelque chose qui fonctionne sur tous les navigateurs.

EDIT: Je n'ai besoin d'aucune barre de progression de téléchargement car les fichiers sont généralement petits. Je n'ai pas besoin de télécharger plusieurs fichiers. J'ai juste besoin d'un téléchargement de fichier unique.

12
Alice

Malheureusement, vous ne pouvez pas utiliser Ajax (XMLHttpRequest en d'autres termes) pour envoyer des fichiers, mais vous pouvez implémenter un comportement similaire en utilisant le <iframe/> Avec un <form method="post" enctype="multipart/form-data"/> Qui contient un <input type="file"/> qui envoie un fichier choisi par l'utilisateur de la manière "naturelle". Vous pouvez utiliser javascript pour appeler la form.submit() puis interroger ce <iframe/> À partir du document parent pour vérifier si le processus de téléchargement de fichier est terminé.

jQuery a beaucoup de plugins sympas pour faire ce travail, il y a mon préféré , par exemple.

18
Dan K.K.