Laravel 使用 Ajax 以一种形式更新数据和文件？当方法/类型='PUT'答案

【问题标题】：Laravel Updating both data and files in one form using Ajax? when method/type='PUT'Laravel 使用 Ajax 以一种形式更新数据和文件？当方法/类型='PUT'
【发布时间】：2020-02-17 05:52:31
【问题描述】：

好吧，当我不使用 ajax 通过添加隐藏的 _method 参数（其中值为“PUT”）直接从表单向服务器发送数据时 -> 一切都像更新表单的魅力一样工作。但是，当我尝试使用 ajax 在控制器更新功能中为 $request 对象接收 null 时尝试相同的操作。现在我很害怕删除我必须使用method='POST'。

我同时使用了 method='POST' 或 type='POST' 但没有运气。

Route::resource('contents', 'ContentController');
let url_content_update = "{{ route('contents.update', ':id') }}";

WebApp.ContentController.onClickUpdateButton = function () {
    var _id = $("#form_id").data('_id');
    var form = $("#form_id")[0];
    var formData = new FormData(form);
    console.log(formData.get('title'));// console print "I am title" just fine.
    $.ajax({
         headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        },
        url: url_content_update.replace(':id', _id),
        method: 'PUT',
        contentType:false ,
        processData: false,
        data: formData,
        xhr: function() {
            var xhr = new window.XMLHttpRequest();
            xhr.upload.addEventListener("progress", function(evt) {
                if (evt.lengthComputable) {
                    var percentComplete = evt.loaded / evt.total;
                    $('#status').html('Upload a file (compulsory):<b> Uploading -> ' + (Math.round(percentComplete * 100)) + '% </b>');
                }
            }, false);

            return xhr;
        },
        success: function (result) {

        },
        error: function (jqXHR, exception) {
        }

    })

}

控制器： 成功收到 $id=383 的值。 但在 $request 对象中发现 null；

 public function update(Request $request,  $id)
    {
        $content = Content::find($id); 
        $content->app_id=$request->app_cat; 
        $content->cat_id=$request->category;
        $content->sub_cat_id=$request->subcategory;
        $content->title=$request->title;
        $content->content_type=$request->type;
        if($request->type==3||$request->type==4||$request->type==5){
            //return json_encode($request->hasFile('any_file'));
            if($request->hasFile('any_file')){
                $content->content=$this->storeFile($request);
            }
        }else{
            $content->content=$request->content;
        }

        $fileNameToStore='no_image.jpg';
        if($request->hasFile('cover_image')){
            $this->validate($request,[
                'cover_image'=>'image|nullable|max:1999'
            ]);
            $content->cover_image=$this->storeImage($request);
        }

        $content->save();
        $output = array("message"=>"Content updated successfully", "status" => "200");
        echo json_encode($output);
    }

【问题讨论】：

你的路线怎么样？
PUT|补丁 |内容/{内容} |内容更新 | App\Http\Controllers\ContentController@update
看我的回答，如果有帮助请告诉我。
@AndySong 谢谢你......它就像魔法一样工作。只需添加 formData.append('_method', 'PUT'); 就解决了“神奇”的问题
你能投票并接受我的回答吗？哈哈

标签： javascript html ajax laravel request

【解决方案1】：

这是自 2016 年以来已知的 issue，以下是您如何以传统形式提交 put。

<form action="/foo/bar" method="POST">
    @method('PUT')
    @csrf
</form>

所以基本上如果你想使用FormData你不能使用put或patch作为方法，你必须使用post。另外，你需要告诉 laravel 请求应该是 PUT 所以你的代码必须是这样的

   ...
            var formData = new FormData(form);
            //this line is equivalent with @method('PUT') in traditional form
            formData.append('_method', 'PUT');
   ...
            //this line is equivalent with method="POST" in traditional form
            method: 'POST',

不幸的是，如果您想使用FormData，这是唯一的解决方案。

【讨论】：