Read reply json at Axios Laravel Vue

Question

Read reply json at Axios Laravel Vue

Navigation

#1 by (2 votes)

2

I have a method that captures the information sent by the vue view (Profile.vue) through a PUT generated by Axios, the problem lies in the following, when the data is updated (using the myProfile method of the UserController driver), axios it captures the return information in json from the method, and the success message is displayed, but when there is an error, Axios does not capture the error json information and it alleges the following:

Uncaught (in promise) TypeError: Cannot read property 'status' of undefined

I understand that you are alleging to me by the variables that I have in the catch of Axios that do not have information

The myProfile code is as follows:

    $profile = User::find(Auth::user()->id);
    $profile->firstname = $request->firstname;
    $profile->lastname = $request->lastname;
    $profile->gender = $request->gender;
    $profile->description = $request->description;
    if($profile->update())
    {
        return response()->json([
                'status' => 'Muy bien!',
                'msg' => 'Datos actualizados correctamente.',
                'cod' => 201
        ]);
    }
    else{
            return response()->json([
                'status' => 'Ocurrio un error!',
                'msg' => 'Ocurrio un error al actualizar la información.',
                'cod' => 400
                ]);
    }

Axios section of Profile.vue

axios.put('/dashboard/profile', value)
            .then((response) => {
                let title = response.data.status;
                let body = response.data.msg;
                this.displayNotificationSuccess(title, body);
            })
            .catch((response) => {
                let title = response.data.status;
                let body = response.data.msg;
                this.displayNotificationError(title,body);
            })

As I commented previously, when there is success in the controller, Axios reads and shows the message json, when there is an error, it does not do it.

Where am I failing that Axios can not show the erro json message coming from the controller?

Ocupo Laravel 5.6, Vuejs 2 and Axios

laravel laravel-5 vue.js

asked by Felipe 14.04.2018 в 20:46

source

1 answer

Choose the photograph in a form with selects Replace values from a list in an array in Python

score 2 · Accepted Answer

The problem is that you are not passing status code to your response from Laravel so you will always get a status 200 of OK , it is for this reason that you will never enter the catch from axios.

To solve the status code, the second parameter is passed to the function ->json() in the following way.

response()->json([], statuscode)

The complete list of codes is in Symfony\Component\HttpFoundation\Response

Then your solution would be.

Laravel

if($profile->update())
{
    return response()->json([
        'status' => 'Muy bien!',
        'msg' => 'Datos actualizados correctamente.',
    ],201);
}
else{
    return response()->json([
        'status' => 'Ocurrio un error!',
        'msg' => 'Ocurrio un error al actualizar la información.',
    ],400);
}

Axios

axios.put('/putroute')
   .then(response => {
       console.log(response);
    })
   catch(error => {
        //obtener el status _(error 400)
        console.log(error.response.data.status);
   })