MethodNotAllowedException 在 Laravel 中向 web.php 发出 Post 请求

Question

所以我已经切换到在我的 laravel 项目中使用 vue 组件。我正在尝试通过 web.php 文件向我的登录控制器发出发布请求，但是当我尝试这样做时，我收到一个错误，说 MethodNotAllowedException，我认为这可能与csrf 保护有关，但即使添加我的帖子请求的标题没有解决我的问题。

这里是发出 post 请求的 vue 登录组件

<template>
    <div class="container">
        <div class="row justify-content-center">
            <div class="col-md-6">
                <div class="card card-default">
                    <div class="card-header">
                        Login
                    </div>

                    <div class="card-body">
                    <form @submit.prevent="login">
                        <input type="text" v-model="username" class="form-control mb-3" placeholder="Email">
                        <input type="password" v-model="password" class="form-control mb-3" placeholder="Password">
                        <div>
                            <button type="submit" class="btn btn-primary btn-block">Login</button>
                        </div>
                    </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
    export default {
        name: 'login',
        data() {
            return {
                username: '',
                password: ''
            }
        },
        methods: {
            login() {
                this.$store.dispatch('login', {                    
                    username: this.username,
                    password: this.password
                })
            }
        }
    }
</script>

这是我使用全局配置的标头调度的存储操作。我不确定是否还需要将其传递给 axios 对象？

import Vue from 'vue'
import Vuex from 'vuex'
import axios from 'axios'

Vue.use(Vuex)
axios.defaults.baseURL = 'http://multitenant-diy.test/web'
let token = document.head.querySelector('meta[name="csrf-token"]');
axios.defaults.headers.post['header1'] = {
    'X-Requested-With': 'XMLHttpRequest',
    'X-CSRF-TOKEN': token.content
}

export default new Vuex.Store({
  actions: {
    login(context, credentials) {
        axios.post('/login', {
            username: credentials.username,
            password: credentials.password
        })
        .then(response => {
            console.log(response.data);
            context.commit('loggedIn', response.data)
        })
        .catch(error => {
            console.log(error.response.data)
        })
    }
  }
})

这是我正在调用的 web.php 登录路径

Route::domain('multitenant-diy.test')->group(function () { 
    Route::get('/{any}', 'AppController@index')->where('any', '.*');
    Route::post('/login', 'AdminController@login');
});

任何关于我缺少什么的见解将不胜感激！

Answer 1

一定要记住这一行

<meta name="csrf-token" content="{{ csrf_token() }}">