Laravel控制器Ajax提交FormData返回array(0) {}问题求助

我在表单里设置了文本和图片输入框，打算通过Ajax请求提交数据，用FormData格式发送到Laravel控制器，但尝试获取表单输入数据时，得到的结果是array(0) {}。发送Ajax前的控制台打印显示FormData里包含正常的文本字段和文件数据，但Laravel控制器那边拿不到任何数据。

原Ajax请求代码 #

$("form").on('submit', function(){

var data = new FormData(this);
var url = "{{ route('ajaxSubmitFormWizardsEmployee') }}";
var csrf_token = $(this).find('input[name="_token"]').val();

$.ajaxSetup({
     headers: {
    'X-CSRF-TOKEN': csrf_token,
     }
});
$.ajax({
 type: "POST",
 url: url,
 async: false,
 cache: false,
 contentType: false,
 processData: false,
    data: {
        data : data,
    },
    success:function(data){
    console.log(data);
    },
     error: function() {
    console.log('error');
     },
    
}); 

原Laravel控制器代码 #

public function ajaxSubmitFormWizardsEmployee(Request $request) {
    $input = $request->all();        
    print_r($input);
}

问题原因 #

问题出在Ajax请求的data参数上——你把FormData对象嵌套在了一个普通对象里（{data: data}），这会导致Laravel无法正确解析FormData格式的数据。FormData需要直接作为data的值传递，不能额外包装。

修正后的Ajax代码 #

$("form").on('submit', function(e){
    e.preventDefault(); // 阻止表单默认提交行为，避免页面刷新
    var data = new FormData(this);
    var url = "{{ route('ajaxSubmitFormWizardsEmployee') }}";
    var csrf_token = $(this).find('input[name="_token"]').val();

    $.ajaxSetup({
         headers: {
        'X-CSRF-TOKEN': csrf_token,
         }
    });
    $.ajax({
     type: "POST",
     url: url,
     async: false,
     cache: false,
     contentType: false,
     processData: false,
        data: data, // 直接传递FormData对象
        success:function(data){
        console.log(data);
        },
         error: function() {
        console.log('error');
         },
        
    }); 
});

补充说明 #

修正后，Laravel控制器里的$request->all()就能正常获取到文本字段数据，文件可以通过$request->file('你的文件输入框name')获取。另外，必须加上e.preventDefault()阻止表单默认提交，避免页面刷新打断Ajax请求流程。

内容的提问来源于stack exchange，提问作者sweethunt99