此路由不支持 POST 方法。支持的方法：GET、HEAD。",...

Question

我在使用 laravel resourceApi 控制器以及我正在创建的 vue js 和我正在使用 vue 和 laravel 的应用程序时遇到问题我正在发布一个值来存储我的控制器的方法，但它说该方法是不允许的或 405响应中的异常。我需要一些帮助我是 laravel 和 vue 的新手。

这是我的代码

**UserController :** 

public function store(Request $request)
    {
        return ['message' => 'i have your data'];
    }

**Route:**
Route::apiResources(['user' => 'API\UserController']);

**Vue Code:**

<form @submit.prevent="createUser">
            <div class="modal-body">
              <div class="form-group">
                <input
                  v-model="form.name"
                  placeholder="Enter name"
                  type="text"
                  name="username"
                  class="form-control"
                  :class="{ 'is-invalid': form.errors.has('name') }"
                >
                <has-error :form="form" field="name"></has-error>
              </div>

              <div class="form-group">
                <input
                  v-model="form.email"
                  placeholder="Enter email"
                  type="email"
                  name="username"
                  class="form-control"
                  :class="{ 'is-invalid': form.errors.has('email') }"
                >
                <has-error :form="form" field="email"></has-error>
              </div>

              <div class="form-group">
                <textarea
                  v-model="form.bio"
                  placeholder="Enter bio"
                  type="email"
                  name="username"
                  class="form-control"
                  :class="{ 'is-invalid': form.errors.has('bio') }"
                />
                <has-error :form="form" field="bio"></has-error>
              </div>

              <div class="form-group">
                <select
                  v-model="form.type"
                  placeholder="Enter bio"
                  name="type"
                  class="form-control"
                  :class="{ 'is-invalid': form.errors.has('type') }"
                >
                  <option value>---Select User Role---</option>
                  <option value="admin">Admin</option>
                  <option value="user">Standard User</option>
                  <option value="author">Author</option>
                </select>
                <has-error :form="form" field="bio"></has-error>
              </div>

              <div class="form-group">
                <input
                  v-model="form.password"
                  placeholder="Enter email"
                  type="password"
                  name="password"
                  class="form-control"
                  :class="{ 'is-invalid': form.errors.has('password') }"
                >
                <has-error :form="form" field="password"></has-error>
              </div>
            </div>
            <div class="modal-footer">
              <button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
              <button type="submit" class="btn btn-primary">Create</button>
            </div>
          </form>

**Vue method :**

  createUser() {
      this.form.post("api/user");
    }

错误：

Answer 1

我已经尝试在我的程序中运行您的代码，您上面提到的所有代码似乎都很好。由于您没有提供createUser方法的代码，所以我认为您在调用api时可能会出错。

请在您的axios 发布路线中尝试以下代码一次。

methods:{
 createUser(){
              axios.post('/api/user/store', {
                   //keep your field here//
         }).then(res => {
                 console.log(res)
                }
             }
    }

Answer 2

你在 axios 中的发布路径可能有错误。如果您显示您的 createUser() 方法会很有帮助。但我猜你必须这样做才能让你的代码运行。

    createUser()
   {
     axios.post('/api/user/store',{

     //your fields and all

       })
    }

Answer 3

API 资源路由不支持创建和编辑功能，我的意思是 POST 或 PUT 方法。 apiResource 方法会自动排除这两个路由（创建和编辑）。如果您想存储或更新某些内容，您可以指定另一个具有相应功能的路由或使用资源路由而不是 API 资源路由，例如，

Route::resource(['user' => 'API\UserController']);

请查看文档https://laravel.com/docs/5.8/controllers#restful-partial-resource-routes

Answer 4

axios 有一个默认路径，所以如果获取请求是 "/user" 路径将是 "http://localhost/client" 但如果您从另一个路径进行调用 "http ://localhost/invoice" 并且获取请求是 "user" 因此 axios 会将当前路径作为基本路径 "http://localhost/invoice/invoice/user"，因此您必须使用 "/user"。

您可以查看文档：https://github.com/axios/axios#request-method-aliases

createUser(){
  axios.post('/api/user',{ 
    /* parameter */
  })
}