Reactjs 控制台错误“；“错误请求”；用Axios和Laravel

我正在使用带有react和axios的laravel 5.8。我建立了一个登录页面，在登录失败后，我得到一个控制台“错误请求”错误。我从服务器得到了正确的响应，但我一直得到post请求的控制台错误

请求如下：

 export const getProfile = () => {
 return axios
    .get('api/profile', {
        headers: { Authorization: `Bearer ${localStorage.usertoken}` }
    })
    .then(response => {

        return response.data
    })
    .catch(err => {
        console.log(err)
    })

}

这是UserController的登录函数

    public function login(Request $request)
    {
    $credentials = $request->json()->all();

    try {
        if (!$token = JWTAuth::attempt($credentials)) {
            $loginsCount = 0; //init counter

            if ($request->session()->has('userLoginsCount')) {

                //get session value
                $loginsCount = $request->session()->get('userLoginsCount');

                //check login attempts count
                if ($loginsCount == 5) {
                    $current_timestamp = now()->timestamp;
                    Log::info($current_timestamp.' User exceeded alowed 
             login attempts : '.$request->ip());
                    $request->session()->put('userLoginsCount', 0);
                    return;
                } else {
                    //increment it
                    $loginsCount++;
                    // set the new value

                    $request->session()->put('userLoginsCount', 
            $loginsCount);
                }
            } else {
                $request->session()->put('userLoginsCount', $loginsCount);
            }

            //Store session
            Session::save();
            return response()->json(['error' => 'invalid credentials'], 
     400);

        }
    } catch (JWTExecption $e) {
        return response()->json(['error' => 'could not create token'], 500);
    }

    return response()->json(compact('token'));

 }

Api路线：

 Route::post('register', 'UserController@register');
 Route::post('login', 'UserController@login');
 Route::get('profile', 'UserController@getAuthenticatedUser');
 Route::middleware('auth:api')->get('/user', function (Request $request) {
    return $request->user();
  });

网站路线：

 Auth::routes();
 Route::get( '/{path?}', function(){
 return view( 'layouts/app' );
 } )->where('path', '.*');

这里是错误的图片

---

我相信这些就是修复一切的步骤

1。将错误响应更改为401（未授权）。

return response（）->json（['error'=>'invalid credentials']，401）；

2。使用前从axios错误响应中检索错误消息。

export const getProfile=（）=>{
返回轴
.get（'api/profile'{
标头：{授权：`Bearer${localStorage.usertoken}`}
})
。然后（响应=>{
返回响应.data
})
.catch（错误=>{
//检索错误消息
让message=err.response.data.error；
控制台日志（消息）；
//现在你可以用“消息”做点什么了
// ...
})

---

您正在将整个错误转储到控制台，而不是提取实际消息。很抱歉，我忽略了这一点。

我相信这些是修复所有问题的步骤

1.将错误响应更改为401（未授权）。

return response（）->json（['error'=>'invalid credentials']，401）；

2.使用前从axios错误响应中检索错误消息。

export const getProfile=（）=>{
返回轴
.get（'api/profile'{
标头：{授权：`Bearer${localStorage.usertoken}`}
})
。然后（响应=>{
返回响应.data
})
.catch（错误=>{
//检索错误消息
让message=err.response.data.error；
控制台日志（消息）；
//现在你可以用“消息”做点什么了
// ...
})

---

您正在将整个错误转储到控制台，而不是提取实际的消息。很抱歉我忽略了这一点。

谢谢，我已尝试记录错误，但我没有抓住要点，我没有记录错误，而是在图片中添加了控制台错误……我想错误来自登录方法中的UserConroller可能是我应该做一些不同的事情当某些事情发生时（非200个响应），您绝对应该看到控制台错误-这是正常的和预期的。但是，您可能应该发送401（未授权）而不是400（错误请求），因为这是一种身份验证。我不确定您为什么没有看到

console.log（err）

来自catch语句。也许可以尝试将

Accept:'application/json'

添加到您的axios头中。另外，如果您更改值时看到401错误，请告诉我。谢谢，我会随时通知您，我会在几小时内找到它。谢谢，我尝试记录错误，但我没有得到捕获，而是记录错误，我得到了错误我在图片中添加的ole错误…我认为错误来自登录方法中的UserConroller。也许我应该做一些不同的事情。当某些事情发生时，您绝对应该看到控制台错误（非200响应）-这是正常的，也是预期的。但是，您可能应该发送401（未授权）而不是400（错误请求），因为这是一个身份验证。我不知道为什么您没有看到

console.log（err）

来自catch语句。也许可以尝试将

Accept:'application/json'

添加到您的axios头中。另外，如果您更改值时看到401错误，请告诉我。谢谢，我会随时通知您，我会在几个小时内找到它