Laravel AJAX 不发布图片答案

【问题标题】：Laravel AJAX not posting imageLaravel AJAX 不发布图片
【发布时间】：2019-12-29 13:36:58
【问题描述】：

我有一个包含上传文件选项的表单。当表单与图像一起提交时，表单中的所有数据都会发送到控制器。如您所见，AJAX 正在发布所有参数，但不是图像：

_token=dNyEbbLUQC8EvAWS0excGult93epW2anNVp35mfp&VideoTitle=test&VideoStrapline=test&VideoURL=test&editordata=%3Cp%3Etest%3C%2Fp%3E&VideoTags=test&MetaActName=test&MetaRegion=England%20-%20Midlands&MetaGenre=Alternative&MetaVenue=test*** /p>

...
<div class="form-group row">
    <div class="col-md-12">
        <label for="VideoCoverPhoto">Cover image</label>
        <input id="VideoCoverPhoto" type="file" enctype="multipart/form-data"  class="form-control" name="VideoCoverPhoto">
    </div>
</div>
<div class="form-group row mb-0">
   <div class="col-md-12">
       <button type="submit" class="btn btn-block btn-primary btn-submit-add-video">Add Video</button>
   </div>
</div>

<script type="text/javascript">

    $.ajaxSetup({
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        }

    });
        $(".btn-submit-add-video").each(function(){
      $(this).on("click",function(e){
        e.preventDefault();

        let form = $(this).closest('form');

        $.ajax({
            type:'POST',
            url: form.attr('action'),
            data: form.serialize(),
            success:function(data){
                alert(data.successful);
            }
        });

        console.log(form.serialize());
    })
    });

</script>

为什么上传的图片没有和数据一起提交？

【问题讨论】：

标签： ajax laravel forms image

【解决方案1】：

首先确保您的表单具有 enctype="multipart/form-data" 属性。然后使用 FormDAta 对象，这是通过 ajax 上传文件的现代和首选方式。

$.ajax({
        type:'POST',
        url: form.attr('action'),
        data: new FormData(form),
        success:function(data){
            alert(data.successful);
        }
 });

【讨论】：