图像不适用于更新方法| Laravel + VueJs

Question

我设法创建了一个带图像的帖子，现在我也希望能够更新它。使用更新方法一切正常，直到我添加了更新图像的选项。除了给我500内部服务器错误的图像外，所有内容都会更新。

我可以在创建帖子时保存图片，但如果我尝试更新帖子图片，则会给我500个内部服务器错误。 当我检查控制台时，它看起来如下所示：

这是我在控制器中的更新方法：

public function update(Request $request, $id)
{
    $exploded = explode(',', request('image'));
    $decoded = base64_decode($exploded[1]);
    if(str_contains($exploded[0], 'jpeg'))
        $extension = 'jpg';
    else
        $extension = 'png';   

    $fileName = str_random().'.'.$extension;
    $path = public_path().'/'.$fileName;
    file_put_contents($path, $decoded);

    $post = Post::findOrFail($id);
    $post->title = request('title');
    $post->description = request('description');
    $post->category_id = request('category_id');
    $post->user_id = Auth::id();
    $post->photo = $fileName;
    $post->save();

    return response()->json([
        'post' => $post,
    ], 200);
}

在我的vue模板中，我在html中使用了这个

<div class="form-group">
  <label>Image</label>
  <input type="file" @change="imageChanged" class="form-control">
</div>

imageChanged方法如下所示：

 imageChanged(e){
   var fileReader = new FileReader()
   fileReader.readAsDataURL(e.target.files[0])
   fileReader.onload = (e) => {
      this.post.photo = e.target.result
   }
 },

编辑帖子如下：

editPost(){
  axios.patch('/api/posts/' + this.update_post.id, {
      title: this.update_post.title,
      description: this.update_post.description,
      category_id: this.update_post.category_id,
      photo: this.update_post.photo
  })
  .then(response => {
    this.showPosts();
  })
  .catch(function(error){
    console.log(error);
  });
}

我在错误日志中看到以下内容，但不知道它们的含义：

#47 C:\\xampp\\htdocs\\sidneyblog\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Pipeline.php(53): Illuminate\\Pipeline\\Pipeline->Illuminate\\Pipeline\\{closure}(Object(Illuminate\\Http\\Request))
#48 C:\\xampp\\htdocs\\sidneyblog\\vendor\\laravel\\framework\\src\\Illuminate\\Pipeline\\Pipeline.php(104): Illuminate\\Routing\\Pipeline->Illuminate\\Routing\\{closure}(Object(Illuminate\\Http\\Request))
#49 C:\\xampp\\htdocs\\sidneyblog\\vendor\\laravel\\framework\\src\\Illuminate\\Foundation\\Http\\Kernel.php(151): Illuminate\\Pipeline\\Pipeline->then(Object(Closure))
#50 C:\\xampp\\htdocs\\sidneyblog\\vendor\\laravel\\framework\\src\\Illuminate\\Foundation\\Http\\Kernel.php(116): Illuminate\\Foundation\\Http\\Kernel->sendRequestThroughRouter(Object(Illuminate\\Http\\Request))
#51 C:\\xampp\\htdocs\\sidneyblog\\public\\index.php(55): Illuminate\\Foundation\\Http\\Kernel->handle(Object(Illuminate\\Http\\Request))
#52 {main}
"} 

如何使用图片更新帖子？

Answer 1

然后我注意到，首先我使用了错误的属性名称，所以我使用$ this.update_post替换了我的函数，而不是this.post

imageChanged(e){
   var fileReader = new FileReader()
   fileReader.readAsDataURL(e.target.files[0])
   fileReader.onload = (e) => {
      this.post.photo = e.target.result
   }
 }

然后用@rkj提示改变补丁方法并改用put。