Retrieving Headers from 302 (redirect) response in angular 4.3+

Question

With SPA apps you apparently need to use implicit grants when utilizing JWTs. This is fine, however, the only way I can retrieve this JWT is by either making a POST or GET request with payload or url Params containing specific information (client id, token type, etc). The endpoint (on success) responds with a 302 status and a Location header containing the access token I need to make API requests.

From what I have seen so far, there does not seem to be a way in Angular to intercept a 302 redirect. I have tried creating my own interceptor service (the closest I have gotten was the 200 response after the page was redirected).

I have tried putting the “observe: ‘response’” option in my get/post requests but again the Location header is not present and it never shows the 302 (even though I can see it in my debug console).

I have verified it is NOT a CORS issue because on the proxy the expose headers option is set to the location value.

The only thing that I can do to get it to work is by using an iframe and listening on the iframe for the redirect. But I do not want to do this as it is clunky and not always reliable.

Can anyone out there tell me is there a way to catch, intercept, or view the location header on a 302 response of a GET/POST request using Angular’s Httpclient? Is there some kind of plugin or node module I can download to help me achieve this?

Answer 1

302 status code - URL redirect will be directly handled by the browser. Angular2 http client won't receive this event.

try using a Jquery script call

$.ajax({
        url: "service call URL",
        dataType: "script",
        crossDomain: true,//if needed
        statusCode: {
          302: function() {
             alert( "redirect" );
          }
        }
        success: function(){}
      });

http://api.jquery.com/jquery.ajax/

statusCode section