我正在运行一个基于Symfony 2.8的Web应用程序,该应用程序使用Ajax将一些表单数据发送回控制器。
到目前为止,一切工作正常,但是由于最新的macOS更新至版本10.13.4,用户开始报告,因此提交表单在Safari中不再起作用。10.13.4上的其他macOS版本和其他浏览器仍然可以正常工作,因此在Safari中似乎是一个问题。我当然向苹果提交了错误报告,但我认为我永远不会从那里得到反馈…
我能够找出问题的根源:提交包含空文件输入的数据失败:
// safri_bug.html <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> </head> <body> <form name="app_booking" method="post" action="/test/submit.php"> <div><input type="text" id="someValue" name="value"></div> <div><input id="thefile" type="file" name="file"></div> </form> <button id="bSubmit" type="button">Submit</button> <script> $(document).ready(function() { $('#bSubmit').click(function() { var form = $('form'); var data = new FormData(form[0]); $.ajax({ url : '/submit.php', type : 'POST', data : data, contentType: false, processData: false, context : this, success : function(response) { alert('success: ' + response); }, error: function (xhr, ajaxOptions, thrownError) { alert('error: ' + xhr.responseText + ' - ' + thrownError); } }); }); }); </script> </body> </html> // submit.php <?php echo "OK";
结果
submit.php
因此,这似乎是最新的Safari更新中的错误? 还是我的代码有什么问题?
知道如何防止此错误吗?
同时,我找到了这种快速而肮脏的解决方案。但是实际上我正在寻找一个真正的解决方法。有任何想法吗?
// Filter out empty file just before the Ajax request // Use try/catch since Safari < 10.13.4 does not support FormData.entries() try { for (var pair of data.entries()) { if (pair[1] instanceof File && pair[1].name == '' && pair[1].size == 0) data.delete(pair[0]); } } catch(e) {}