Laravel Vue 如何从 Vue 更新用户表中的列答案

【问题标题】：Laravel Vue How to update a column in the user table from VueLaravel Vue 如何从 Vue 更新用户表中的列
【发布时间】：2020-12-23 04:44:03
【问题描述】：

我想从 Vue 向 Laravel 发送一个请求，以更新当前登录用户的列。

到目前为止，我已经设置了 Vuex，我正在使用 axios 发送一个发布请求。但是我不断收到错误 419。这显然意味着它是 CSRF 令牌问题。

我如何将 CSRF 令牌解析到我的后端我的代码中的当前方法不起作用。
有没有更容易的替代路线。

api.php 中的路由

Route::group(['middleware' => 'web'], function () {
    Route::post('prequalify', 'OfferController@update');
});

控制器

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use Illuminate\Support\Facades\Auth;
use App\User;

class OfferController extends Controller
{
    function update(Request $request){
        $user = Auth::user();
        return $user;
        //Send Request to Majestic and get a response
        $response = true;
            if($response){
                $user->is_qualified = true;
            }else{
                $user->is_qualified = false;
            }

            $user->save();


        return $request;
    }
}

Vue 方法并且我能够获得 CSRF 令牌。

preQualify(){
        let csrf= document.querySelector('meta[name="csrf-token"]').getAttribute('content')
        this.$store.dispatch('prequalify',{csrf});
    }

VUEX 操作

import axios from 'axios';
let actions = {
    prequalify({commit,state}, payload){
        axios.defaults.headers.common['X-CSRF-TOKEN'] = payload.csrf;
        axios.post('/api/prequalify',state.LoanCalculator)
            .then(res => {
                console.log(res);
            })
    }
}
export default actions

【问题讨论】：

标签： php laravel api vue.js vuex

【解决方案1】：

在您的api.php 中，您使用的是web 中间件，该中间件检查VerifyCsrfToken 中间件，该中间件负责验证CSRF 令牌以及为您提供419 的原因，为了使其更简单，您需要删除@ 987654326@中间件

Route::group(['middleware' => []], function () {
    Route::post('prequalify', 'OfferController@update');
});

在这种情况下，您无需在axios 呼叫中发送X-CSRF-TOKEN。

注意 - 如果prequalify 端点要求对用户进行身份验证，您需要使用与您正在使用的auth 系统相对应的正确中间件，可以是passport 或sanctum。

【讨论】：

【解决方案2】：

我是这样用的

在bootstrap.js

window.csrfToken = $('meta[name="csrf-token"]').attr("content");

然后在 axios req.

 axios.post('/api/prequalify',{_token:csrfToken,data:state.LoanCalculator})
            .then(res => {
                console.log(res);
            })

可能有更好的方法，但我在我的应用程序中使用了它希望它可以解决您的问题

【讨论】：

这里/api/prequalify使用了什么中间件.?