How to display response error message with axios

Question

Been looking to achieve this few months now but now it's needed. I need to display the error message, set on server, about what went wrong:

Sever endpoint

abort(406, 'Foo bar!')

Web:

[...]
 .catch(e => {
  console.log(e.response.data) // does not work
 })

In chrome dev tools, under preview, I see the message Foo bar!. How to get this message on my console log?

This endpoint will have different abort messages based on actions so I do not want to set a static error message on web for the error.

Chrome dev tools message:

Possible duplicate of [How can I get the status code from an http error in Axios?](https://stackoverflow.com/questions/39153080/how-can-i-get-the-status-code-from-an-http-error-in-axios) — Sylar, Jun 09 '17 at 16:19

Matija Župančić · Answer 1 · 2017-06-06T09:49:01.723

20

This should work : console.log(e.response.data.message). I think this is what you looking for.

This is for this type of request:

axios.post(
    url,
    {},
    })
    .then(function (response) {
      console.log(response);
    })
    .catch(function (error) {
      console.log(error.response.data.message);
    });

edited Jun 06 '17 at 09:49

answered Jun 06 '17 at 09:29

Matija Župančić

1,080
2
11
21

Nothing returns the message I set: `Foo bar!` – Sylar Jun 06 '17 at 09:36
Did you try with e.message? – Matija Župančić Jun 06 '17 at 09:37
I got `Request failed with status code 406`. Im using Laravel if that makes a different. But Chrome dev tools show the actual message `Foo bar!` – Sylar Jun 06 '17 at 09:38
Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/145957/discussion-between-matija-zupancic-and-sylar). – Matija Župančić Jun 06 '17 at 10:21
Line 4 Missing '{' – call-me May 17 '18 at 08:09

score 1 · Answer 2 · answered Jun 20 '22 at 20:24

1

This may help

catch (error) {
            if (error.response) {
                console.log(error.response)
                console.log(error.response?.data?.message)
                return 
            }
        }

answered Jun 20 '22 at 20:24

Ayooluwa Aduwo

49
2

score -1 · Answer 3 · answered May 23 '18 at 02:17

-1

I have encountered this problem. i created an axios instance, the responseType is 'json', axios.create({ ... responseType: 'json' })

response type is not json，so i can't got it. remove this property can solve this problem

answered May 23 '18 at 02:17

Ray Jumi

1
1

can you elaborate why removing the responseType can solve this problem? – Lex May 23 '18 at 02:51
The response content-type returned by the server is not json, is 'arraybuffer', 'blob', 'document', or other ，i set json，so can not get other type – Ray Jumi May 23 '18 at 06:06

How to display response error message with axios

3 Answers3