Javascript 400仅在Safari中发布jQuery ajax时请求错误

当我向jQueryAjax发布表单时，我突然发现Safari中出现了400个错误请求。我觉得这很奇怪，因为它已经正常工作了2-3年，而且它仍然在Firefox中工作。我不知道从哪里开始调试，有人能帮我吗

submitHandler: function()
{
var formElement = document.getElementById("frmBanner");
var bannerfil = new FormData(formElement);  
bannerfil.append("gruppe412", $('#gruppe412').val() );

 $.ajax(
 {
     type: "POST",
     url: "/modContent/ajax/banner-copy.php?a=frmBanner&type=45",
     data: bannerfil,
     dataType: "html",
     processData: false,
     contentType: false,
     success: function(data) 
     {
        if( data.length > 10 )
            $("#content").html( data );
        else
          location.href="#modContent/ajax/" + data;

     },
     error: function (xhr, ajaxOptions, thrownError) { alert(xhr.statusText); }
});

return false;
},
// Do not change code below
errorPlacement : function(error, element) {
    error.insertAfter(element.parent());
}
}

---

有趣的是，我在我的一个网站上发现了同样的问题，就在你发帖几小时后。我同意你的观点，这是一个最近的问题，但是我不知道是哪个版本的Safari引入了这个bug

以下是我得出的结论： 您可以通过将表单传递给

FormData

对象来构造它，这应该很好。但是Safari似乎有一个bug：当您通过向表单传递一个输入了空文件的表单来构造FormData对象时，由于某种原因请求会中断

解决办法： 而不是执行

var bannerfil=newformdata（formElement）

要初始化我的

FormData

，我现在正在初始化一个空的FormData对象并手动添加值。在添加文件输入之前，我检查它是否确实附加了任何文件

formData = new FormData();
var $form = $(this); // <- change this depending on your scope/usecase

// [type="file"] will be handled separately
$form.find('input[name][type!="file"], select[name], textarea[name]').each(function(i, e) {
    if ($(e).attr('type') == 'checkbox' || $(e).attr('type') == 'radio') {
      if ($(e).is(':checked')) {
        formData.append($(e).attr('name'), $(e).val());
      }
    } else {
      formData.append($(e).attr('name'), $(e).val());
    }
});

$form.find('input[name][type="file"]').each(function(i, e) {
    if ($(e)[0].files.length > 0) {
      formData.append($(e).attr('name'), $(e)[0].files[0]); 
    }
});

---

谢谢你的回答，它帮助了我！但我决定只检查文件，而不是遍历所有输入。从formdata中删除文件，然后再次仅追加非空文件：

let formdata = new FormData(form[0]);
let files = formdata.getAll('upload[]');
formdata.delete('upload[]');
files.forEach(function(fileobject){
    if(fileobject.size){
        formdata.append('upload[]', fileobject);
    }
});

---

我们需要日志来帮助你@伊齐奥，好吧，我得把服务器弄得乱七八糟。请稍等，我看看能找到什么。除了HTTP 400之外，Chrome控制台中还有错误吗？@Luca我刚刚测试了Chrome。当我在Chrome中发布时，我得到modContent/ajax/目录列表作为回报。没有其他错误没有。@Izio我在服务器上的错误日志中找不到任何有用的东西？很好，很抱歉回复太晚，我一定会测试一下，看看是否有效。这感觉有点像是一个不必要的解决办法，但这就是让它发挥作用所需要的。好吧，如果这是Safari中的一个bug，我们除了尝试解决它之外，没有什么可做的。事实上，它可以在其他浏览器中使用，甚至在Safari中也可以使用，这对我来说绝对是一个bug。嗯，如果我运行上面的代码（将formData更改为bannerfil），那么我不会从我发布的表单中获得任何值…？我只是在使用其他代码的网站上运行它。替换的

var bannerfil=新的FormData（formElement）与您的代码一起使用，以查看我是否可以让它工作。根据范围的不同，您可能需要将
$（此）
替换为
$（“#frmBanner”）
。
let formdata = new FormData(form[0]);
let files = formdata.getAll('upload[]');
formdata.delete('upload[]');
files.forEach(function(fileobject){
    if(fileobject.size){
        formdata.append('upload[]', fileobject);
    }
});