0

I am new to building web applications. I am writing Vue.js application and i use axios to handle http communication. If something wents wrong (for example, user won't authorized correctly), my backend returns me a message with status code 4xx. Then an exemplary error is shown in browser console:

enter image description here

The problem is, although the behavior of my backend is desired, there are some errors in browser console. I would like just to process error message and inform user about an error by myself. Here is my code:

axios.interceptors.response.use(
    (response) => {
        return response;
    },
    (error) => {
        return Promise.reject(error);
    }
);

...

async post(resource, data, jwt) {
    var response = null;
    await axios.post(resource, data, { jwt })
        .then(r => {
            response = r.data;
        })
        .catch(error => {
            var errorMessage = prepareErrorMessage(error.response.data);
            vm.$snotify.error(errorMessage);
            throw error;
        });
    return response;
}

function prepareErrorMessage(errorData) {
    var errorMessage = '';
    errorData.forEach(e => {
        errorMessage += e.message + ' ';
    });
    return errorMessage;
}

What am i doing wrong? How to get rid of logging error to console? Thanks for any help.

Bulchsu
  • 580
  • 11
  • 33
  • Remove the ```throw error;``` statement. Since you already have handled error inside the catch(), it is not needed to throw the error again. –  Apr 21 '20 at 15:14
  • Doesn't help - still error information is shown in a console – Bulchsu Apr 21 '20 at 15:16
  • Ok so i found [this](https://stackoverflow.com/questions/51978983/how-to-remove-the-console-errors-in-axios?rq=1). Hope it help! –  Apr 21 '20 at 15:49
  • Oh, thank you very much, i think it answers my question (but also makes me unhappy :d). Thank you – Bulchsu Apr 21 '20 at 15:58

0 Answers0