javascript - Handling http 302 redirect responses - Stack Overflow

admin管理员组

文章数量:1024074

I know that http 302 responses are handled directly by the browser, and because of that you cannot acces any of the request properties from your source code. But I am wondering if there is any way of intercepting the 302 redirect response. Let me explain myself:

1. My Frontend (Angular) makes an http request to A (I intercept the outgoing request)
2. A responds with 302 Location: B
3. My Frontend intercepts the 302 response with empty fields, and goes to B
4. Here I'd like to intercept the response ing from B

This is my Angular http interceptor code:

@Injectable()
export class CasInterceptor implements HttpInterceptor {
  intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    console.log('->Interceptor');
    console.log(req);
    return next.handle(req).map((event: HttpEvent<any>) => {
        const response = event as HttpResponseBase;
        console.log('<-Interceptor');
        console.log(response);
        return event;
    });
  }
}

I know that http 302 responses are handled directly by the browser, and because of that you cannot acces any of the request properties from your source code. But I am wondering if there is any way of intercepting the 302 redirect response. Let me explain myself:

1. My Frontend (Angular) makes an http request to A (I intercept the outgoing request)
2. A responds with 302 Location: B
3. My Frontend intercepts the 302 response with empty fields, and goes to B
4. Here I'd like to intercept the response ing from B

This is my Angular http interceptor code:

@Injectable()
export class CasInterceptor implements HttpInterceptor {
  intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    console.log('->Interceptor');
    console.log(req);
    return next.handle(req).map((event: HttpEvent<any>) => {
        const response = event as HttpResponseBase;
        console.log('<-Interceptor');
        console.log(response);
        return event;
    });
  }
}

• javascript
• ajax
• angular
• xmlhttprequest

Share Improve this question Follow asked Feb 5, 2018 at 9:01 gmcgmc 4,01033 gold badges3333 silver badges4646 bronze badges 4

• Browsers do support this but you'll have to check for it and there's no way to polyfill. You'll have to dig deeper in HttpInterceptor or write something from scratch. developer.mozilla/en-US/docs/Web/API/Request/redirect – Tatsh Commented Feb 5, 2018 at 9:09
• Isn't the eventual response from B just what you receive as the eventual response to the original http request? – match Commented Feb 5, 2018 at 9:09
• Not necessarily, that's why I'd like to intercept it: if the user is authenticated the result is the expected from the original request, if not it is a login form. I'd like to be able to check whether the login form came (well, just check if the content type is html) and manually redirect the browser without having to add that logic everywhere, just in the interceptor – gmc Commented Feb 5, 2018 at 9:13
• any solution yet? – Kwexi Commented Feb 23, 2018 at 4:19

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 1

You should get full header from http response.

{observe:"response"} is the magic parameter of angular http client. So try this one

this.http
.get<any>(requestURL,{observe:"response"})
.subscribe(
  data => {
    console.log(data.header); //you will see full header here
    console.log(data.url); // you can see redirect url from backend and handle it whatever you want
  },
  err => {
     console.log(err)
  }

I know that http 302 responses are handled directly by the browser, and because of that you cannot acces any of the request properties from your source code. But I am wondering if there is any way of intercepting the 302 redirect response. Let me explain myself:

1. My Frontend (Angular) makes an http request to A (I intercept the outgoing request)
2. A responds with 302 Location: B
3. My Frontend intercepts the 302 response with empty fields, and goes to B
4. Here I'd like to intercept the response ing from B

This is my Angular http interceptor code:

@Injectable()
export class CasInterceptor implements HttpInterceptor {
  intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    console.log('->Interceptor');
    console.log(req);
    return next.handle(req).map((event: HttpEvent<any>) => {
        const response = event as HttpResponseBase;
        console.log('<-Interceptor');
        console.log(response);
        return event;
    });
  }
}

I know that http 302 responses are handled directly by the browser, and because of that you cannot acces any of the request properties from your source code. But I am wondering if there is any way of intercepting the 302 redirect response. Let me explain myself:

1. My Frontend (Angular) makes an http request to A (I intercept the outgoing request)
2. A responds with 302 Location: B
3. My Frontend intercepts the 302 response with empty fields, and goes to B
4. Here I'd like to intercept the response ing from B

This is my Angular http interceptor code:

@Injectable()
export class CasInterceptor implements HttpInterceptor {
  intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    console.log('->Interceptor');
    console.log(req);
    return next.handle(req).map((event: HttpEvent<any>) => {
        const response = event as HttpResponseBase;
        console.log('<-Interceptor');
        console.log(response);
        return event;
    });
  }
}

• javascript
• ajax
• angular
• xmlhttprequest

Share Improve this question Follow asked Feb 5, 2018 at 9:01 gmcgmc 4,01033 gold badges3333 silver badges4646 bronze badges 4

• Browsers do support this but you'll have to check for it and there's no way to polyfill. You'll have to dig deeper in HttpInterceptor or write something from scratch. developer.mozilla/en-US/docs/Web/API/Request/redirect – Tatsh Commented Feb 5, 2018 at 9:09
• Isn't the eventual response from B just what you receive as the eventual response to the original http request? – match Commented Feb 5, 2018 at 9:09
• Not necessarily, that's why I'd like to intercept it: if the user is authenticated the result is the expected from the original request, if not it is a login form. I'd like to be able to check whether the login form came (well, just check if the content type is html) and manually redirect the browser without having to add that logic everywhere, just in the interceptor – gmc Commented Feb 5, 2018 at 9:13
• any solution yet? – Kwexi Commented Feb 23, 2018 at 4:19

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 1

You should get full header from http response.

{observe:"response"} is the magic parameter of angular http client. So try this one

this.http
.get<any>(requestURL,{observe:"response"})
.subscribe(
  data => {
    console.log(data.header); //you will see full header here
    console.log(data.url); // you can see redirect url from backend and handle it whatever you want
  },
  err => {
     console.log(err)
  }

本文标签： javascriptHandling http 302 redirect responsesStack Overflow