Freigeben über

XMLHttpRequest kann FormData mit einem leeren Dateielement in Microsoft Edge nicht ordnungsgemäß senden.

Warnung

Die eingestellte, nicht mehr unterstützte Desktop-Anwendung Internet Explorer 11 wurde durch ein Microsoft Edge-Update in bestimmten Versionen von Windows 10 dauerhaft deaktiviert. Weitere Informationen finden Sie unter Häufig gestellte Fragen zur Einstellung der Desktop-App von Internet Explorer 11.

Dieser Artikel bietet eine Lösung für das Problem, dass FormData ein leeres Dateielement enthält, welches von XMLHttpRequest in Microsoft Edge unter Windows 10, Version 1809, nicht korrekt gesendet werden kann.

Originalproduktversion: Microsoft Edge, Windows 10
Ursprüngliche KB-Nummer: 4490157

Symptome

Wenn die XMLHttpRequest (jQuery.ajax()) Methode aufgerufen wird, kann ein FormData Objekt, das ein leeres Dateielement enthält, nicht ordnungsgemäß in Microsoft Edge für Windows 10, Version 1809, gesendet werden.

Sie legen beispielsweise eine Datei fest, die nur ein Dateielement enthält und alle anderen Dateielemente leer sind, wie im folgenden Codebeispiel gezeigt:

<!DOCTYPE html>
<html>
    <head>
        <script src="https://code.jquery.com/jquery-1.12.4.js"
            integrity="sha256-Qw82+bXyGq6MydymqBxNPYTaUXXq7c8v3CwiYwLLNXU="
            crossorigin="anonymous"></script>
    </head>
    <body>
        <form action="/AjaxUploadSample/Home/FileUpload" enctype="multipart/form-data" method="post">
            <input name="files" id="files" type="file" value=""><br>
            <input name="files" id="files" type="file" value=""><br>
            <input name="files" id="files" type="file" value=""><br>
            <button id="btn" type="button">Async Upload</button>
        </form>
        <hr>
        <p id="message" style="white-space:pre;"></p>
        <script>
            $(document).ready(function () {
                $("#btn").on("click", function () {
                    var _form = $(this).closest("form")[0];
                    $.ajax({
                        type: "post",
                        url: _form.action,
                        processData: false,
                        contentType: false,
                        data: new FormData(_form),
                        success: function (data, textStatus, jqXHR) {
                            $("#message").text(data.Message);
                        }
                    });
                });
            });
        </script>
    </body>
</html>

Wenn Sie auf "Async Hochladen" klicken, wird die Festgelegtdatei nicht ordnungsgemäß erkannt.

Ursache

Dieses Problem tritt auf, wenn die Implementierung von FormData Microsoft Edge für Windows 10, Version 1809, geändert wird.

Problemumgehung

Um dieses Problem zu umgehen, fügen Sie den folgenden Code ein, bevor $.ajax() aufgerufen wird und leere Einträge explizit überspringen.

// Workaround
var _data = new FormData(_form);
if (_data.entries)
{
    var data = new FormData();
    for (var p of _data)
    {
        if (p[1])
        {
            // p[1] is the value of form entry
            data.append(p[0], p[1]);
        }
    } _data = data;
}
$.ajax(
{
    type: 'post',
    url: _form.action,
    processData: false,
    contentType: false,
    data: _data,
    success: function (data, textStatus, jqXHR)
    {
        $('#message').text(data.Message);
    }
});