Question

因此，我已切换到在laravel项目中使用vue组件。我试图通过web.php文件向我的登录控制器发出发布请求，但是当我尝试这样做时，我在MethodNotAllowedException中收到一条错误提示，我认为这可能与<ListGroup> <ListGroupItem active> <ListGroupItemHeading>List group item heading</ListGroupItemHeading> <ListGroupItemText> Donec id elit non mi porta gravida at eget metus. Maecenas sed diam eget risus varius blandit. </ListGroupItemText> </ListGroupItem> </ListGroup>保护有关，即使将标头添加到我的帖子请求中并没有解决我的问题。

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

csrf

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

<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>

这是我正在呼叫的web.php登录路径

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)
        })
    }
  }
})

任何关于我失踪的见解将不胜感激！

Answer 1

请确保您的脑海中有这条线

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

MethodNotAllowedException向Laravel中的web.php发出发布请求

1 个答案: