使用Axios登录的React + Laravel无法正常工作吗？

Question

所以我可能正在做一些非常规的事情，我将Laravel与React结合在一起。我想将Laravel Auth系统与React前端一起使用。

我遇到的问题是，当我删除onSubmit部分并执行标准表单发布时，登录功能可以正常工作，但是当我使用axios进行操作时，它实际上并没有登录。

所以我已经建立了一个这样的登录表单（希望评论帮助）：

export default class LoginForm extends React.Component
{    
    constructor(props) {
        super(props);
        this.onChange = this.onChange.bind(this);
        this.onSubmit = this.onSubmit.bind(this);
        this.form = React.createRef();
        this.state = {
            disabled: false,
            email: '',
            password: '',
            csrf: document.head.querySelector('meta[name="csrf-token"]').content,
        }
    }

    onChange(event)
    {
        this.setState({
            [event.target.name] : event.target.value
        });
    }

    onSubmit(e) {
        e.preventDefault();
        //disable the submit button so they can't click more than once
        if(this.state.disabled === false){
            this.setState({ disabled: true });

            //post to the login the request to login
            axios.post(
                '/api/login',
                {
                    _token: this.state.csrf,
                    email: this.state.email,
                    password: this.state.password
                }
            ).then(
                (response) =>
                {
                    // The request was made and the server responded with a status code
                    // that falls inside the 2xx range
                    // Login Successful
                    // Since it's successful we should now be logged in and we can go to the home page.
                    // window.location.href = "/";

                    // For Debugging purposes we're not going to go home just yet
                    this.setState({
                        disabled: false
                    });
                    console.log(response);
                    //our response does come back okay if the email and password is correct
                    //however they are not logged in at this point and I'm not sure why. 
                }
            ).catch(
                (error) => {
                    // The request was made and the server responded with a status code
                    // that falls out of the range of 2xx
                    // Login Failed

                    //remove the disabled state so that the user can try logging in again. 
                    this.setState({
                        disabled: false
                    });
                }
            );
        }
    }

    render(){

        const token = document.head.querySelector('meta[name="csrf-token"]');
        retrun(
            <form name="userRegistrationForm" action="/login" method="POST" onSubmit={this.onSubmit} ref={this.form}>
                <input type="hidden" name="_token" value={token.content} />
                <input type="text" name="email" onChange={this.onChange} maxLength="100" placeholder="Email" required/>
                <input type="password" name="password" onChange={this.onChange} maxLength="100" placeholder="Password" required/>
                <button label="Sign In" loading={this.state.submitted} disabled={this.state.disabled} className={"w-100"}>
                    Sign In
                </button>
            </form>
        )
    }
}

这会通过axios向我的laravel登录控制器发送一个请求。

    public function LoginSubmit(Request $request)
    {
        $request->validate([
            'email' => 'required|email|between:1,255',
            'password' => 'required|between:1,255',
        ]);

        $auth = false;
        //get the credentials from the request
        $credentials = $request->only('email', 'password');

        //attempt auth
        if (Auth::attempt($credentials, $request->has('remember'))) {
            $auth = true; // Success
        }

        //if we authed, then login and return
        if ($auth == true) {
            return $this->sendResponse(true);
        } else {
            return $this->sendError(false, "No User found for that email or password does not match");
        }
    }

从理论上讲，这应该起作用，Auth :: attempt（）应该验证凭据并登录用户。实际上，在完成表单后，它可以完美地工作（只需完全删除onSubmit部分）。 Laravel表单登录几乎相同，但是我没有return redirect("/")来返回json响应。

那么从服务器获得200响应以登录用户后，我需要做些什么吗？

编辑：由于该站点已被转换为React，因此我需要该站点执行基于传统cookie /会话的身份验证，因为许多站点仍使用刀片模板和会话身份验证。