从数据库中删除引发请求失败，状态代码为 405 错误

Question

我正在尝试使用 axios 通过 id 从 MySQL 数据库中删除项目。在我的 Vue 组件中，我设置了以下方法来处理删除项目：

deleteTodo(id, index){
        axios.delete('api/todos/' + id).then(function(response){
             console.log(response)
             this.todos.slice(index, 1)
        }.bind(this)).catch((err) => {
              console.log(err)
        })       
}

我在我的模板中调用 deleteTodo 是这样的：

 <li v-for="(todo, index) in todos">
     <span>{{todo.todo}} <button @click="deleteTodo(todo.id, index)">delete</button></span>
 </li>

在我的 TodoController 中，我有以下方法：

 public function remove($id)
 {
    DB::table('todos')->where('id', $id)->delete();
    return redirect('todos');
 }

如果我尝试删除项目，我会在控制台中收到以下错误消息：

Error: Request failed with status code 405
Stack trace:
createError@http://localhost:8000/js/app.js line 107 > eval:15:15
settle@http://localhost:8000/js/app.js line 193 > eval:18:12
handleLoad@http://localhost:8000/js/app.js line 86 > eval:77:7

如果我刷新浏览器，它的应用项目确实被删除了（我也可以通过访问 api/todos 路径确认它们被删除）。但是，我必须点击删除按钮两次并刷新浏览器才能真正从数据库中删除该项目。

为什么会出现此错误，我该如何解决？

Answer 1

问题很可能来自 return redirect('todos'); 的 HTTP 重定向，而请求是 JSON/AJAX 请求（来自使用 axios 的 Vue 组件），因此应该 return 和 JSON 响应。将 return 语句更改为 return response()->json('Deleted'); 应该可以解决问题。

从数据库中删除引发请求失败，状态代码为 405 错误

Deleting from database raises Request failed with status code 405 error

javascript

laravel

vue.js

axios