it-swarm.com.de

Fallback für FormData in IE 8/9

FormData existiert nicht in IE 8/9, aber ich benötige diese Funktionalität in diesen Browsern. Gibt es dafür einen schönen Fallback? 

Ich würde versuchen, Json-Daten zu senden, aber ich muss eine Datei an den Server übergeben. Ich füge diese Datei in modernen Browsern an die Variable formData an und sende einfach eine XHR-Anforderung ab. Da FormData nicht in IE 8/9 vorhanden ist, schlägt dies offensichtlich fehl.

// I cant seem to get this to work with a file.
$.ajax({
    url: '/genericHandlers/UploadDocsFile.ashx',
    type: "POST",
    data: model.toJSON(),
    contentType: 'application/json'
    }).done(function  (data) { 
       log('stuff happened!');
    });

Vielleicht besteht die Alternative darin, ein falsches Formularobjekt in js zu erstellen und die Daten dann anzufügen? 

32
Mike Fielden

Ich kenne nur eine mögliche Lösung, aber es ist nicht wirklich ein Rückfall für IEs. Es gibt keine mögliche Kommunikations-API für das Senden von Dateien, da Sie Eingabefelder in alten Browsern nicht binden können, wie dies in modernen mit FormData der Fall ist. Sie können jedoch das gesamte Formular mit einem iframe senden. In diesem Fall können Sie jquery.form plugin verwenden, das XHR DataForm und iframe unterstützt (Daten werden mit iframe gesendet, wenn der Browser keine FormData-API-Unterstützung unterstützt).

8

Sie können die Datei manuell mit XMLHttpRequests senden. Es gibt viele Informationen hierzu hier .

Sie können testen, ob der Browser das FormData-Objekt zuerst verwenden kann:

if(typeof FormData !== 'undefined')
   ...

MDN hat eine diese Funktion , die Sie für den Fallback ändern könnten:

var XHR = new XMLHttpRequest();
var urlEncodedData = "";
var urlEncodedDataPairs = [];
var name;

// We turn the data object into an array of URL encoded key value pairs.
for(name in data) {
  urlEncodedDataPairs.Push(encodeURIComponent(name) + '=' + encodeURIComponent(data[name]));
}

// We combine the pairs into a single string and replace all encoded spaces to 
// the plus character to match the behaviour of the web browser form submit.
urlEncodedData = urlEncodedDataPairs.join('&').replace(/%20/g, '+');

Diese Antwort befasst sich nicht streng mit der Frage, die Sie gestellt haben. Aus diesem Grund verstehe ich, ob Mods sie entfernen wird.

Ihre Frage stand jedoch in engem Zusammenhang mit einem Problem, das ich recherchiert hatte, nämlich wie man Drag-and-Drop-Uploads über FormData () anbietet, und zwar für ältere Browser?

Es gibt eine wunderbare Bibliothek namens dropzone.js , die eine perfekte Lösung für mein Problem bietet. Der beste Teil ist vielleicht, dass die Bibliothek sofort einsatzbereite Funktionen zur Unterstützung von Dateiuploads in älteren Browsern bietet, wie hier beschrieben

Um die Quelle zu umschreiben:

Wenn der Browser nicht unterstützt wird, zeigt die dropzone.js-Bibliothek glücklicherweise eine anpassbare Fallback-Klasse, die ein Eingabefeld und eine Schaltfläche zum Senden enthält.

Ich hoffe, dass diese Informationen jemandem helfen, der wie ich nach einer einfach zu implementierenden und eleganten Lösung für das Hochladen von Dateien sucht.

0
Jade Steffen