Retrieving the server's response with Angular's interceptor when handling a response error

Question

Retrieving the server's response with Angular's interceptor when handling a response error

I recently developed an interceptor Service using angularJS to capture any errors from API calls and manage general error handling like this:

$provide.factory('myHttpInterceptor', function($q, dependency1, dependency2) {
  return {
   'responseError': function(rejection) {
      alert("An issue occurred");
      return $q.reject(rejection);
    }
  };
});

It works perfectly, and my server returns the following response on error with a status of 409:

{
message: "Email is already in use",
success: false,
token: ""
}

How can I access this response within the responseError interceptor?

javascript angularjs interceptor

Answer 1

Answer №1

Here's a way to accomplish this task:

$httpProvider.interceptors.push(['$q',  function($q) {
        return {
            'request': function (config) {
               //insert your request logic here
                return config;
            },
            'responseError': function(response) {

                console.log(response);
                if(response.statusText){

                    alert(response.statusText)
                }else{
                    alert("Server down")
                }
                if(response.status === 401 || response.status === 409) {
                    //insert your response logic here
                }
                return $q.reject(response);
            }

        };
}]);

})

Answer 2

Here's a way to accomplish this task:

$httpProvider.interceptors.push(['$q',  function($q) {
        return {
            'request': function (config) {
               //insert your request logic here
                return config;
            },
            'responseError': function(response) {

                console.log(response);
                if(response.statusText){

                    alert(response.statusText)
                }else{
                    alert("Server down")
                }
                if(response.status === 401 || response.status === 409) {
                    //insert your response logic here
                }
                return $q.reject(response);
            }

        };
}]);

})

Answer 3

Answer №2

$provide.factory('customHttpInterceptor', function($q, serviceA, serviceB) {
  return {
   'responseError': function(rejection) {
      if(rejection.status === 409) {
          //fetch the error message from rejection.message/rejection.data.message and handle it accordingly
      }
      alert("An error occurred");
      return $q.reject(rejection);
    }
  };
});

Answer 4

$provide.factory('customHttpInterceptor', function($q, serviceA, serviceB) {
  return {
   'responseError': function(rejection) {
      if(rejection.status === 409) {
          //fetch the error message from rejection.message/rejection.data.message and handle it accordingly
      }
      alert("An error occurred");
      return $q.reject(rejection);
    }
  };
});

Retrieving the server's response with Angular's interceptor when handling a response error

Answer №1

Answer №2

Similar questions

What method sits snugly between prepend() and append()?

Magnific Popup is causing a glitch in my Ajax cart slider, preventing my code from functioning properly

Can you tell me the name of the Javascript "protocol" or "custom" being referred to here?

Tips for modifying hover effects using jQuerystylesheet changes

The AJAX call is not being identified correctly

Preloader will properly handle websocket connections along with pace js

How will SEO be impacted if content is concealed using jQuery or JavaScript?

The Server Side Rendering in (Vue+Express) faltered due to inconsistencies in hydration

Generate a random word using Typed.js

What methods are available to gradually increase a counter until it reaches a specific number by a designated date?

Issue with Three.js: real-time color updating for mesh not functioning

Managing the Navigation Bar

"Exploring the process of animating a mesh in three.js that was generated outside of the init

What methods can I utilize to increase the speed of my JavaScript animation?

AngularJS - the factory is a blank canvas ready to be filled with functionality

Tips for utilizing window.scrollTo in tandem with react/material UI?

The POST request from the form is returning a null value

How to extract the HTML content from specific text nodes using Javascript

Step-by-Step Guide on Uploading a File with a Basic jQuery-AJAX Request

Display varying information depending on the option class, rather than its value