首页 > 解决方案 > Laravel Vue 如何从 Vue 更新用户表中的列

问题描述

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

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

  1. 我如何将 CSRF 令牌解析到我的后端我的代码中的当前方法不起作用。

  2. 有没有更容易的替代路线。

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

标签: phplaravelapivue.jsvuex

解决方案


在您api.php使用web的中间件中,该中间件会检查VerifyCsrfToken中间件,该中间件负责验证CSRF令牌以及为您提供的419功能,为了使其更简单,您需要删除web中间件

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

在这种情况下,无需发送X-CSRF-TOKEN您的axios电话。

注意- 如果prequalify端点要求对用户进行身份验证,您需要使用与auth您正在使用的系统相对应的正确中间件,其中可以passportsanctum.


推荐阅读