处理 http 302 重定向响应答案

【问题标题】：Handling http 302 redirect responses处理 http 302 重定向响应
【发布时间】：2018-07-15 02:09:33
【问题描述】：

我知道http 302 响应由浏览器直接处理，因此您无法从源代码访问任何请求属性。但我想知道是否有任何方法可以拦截 302 重定向响应。让我解释一下自己：

我的前端 (Angular) 向 A 发出 http 请求（我拦截了传出请求）
A 回复 302 Location: B
我的前端截获302 带有空字段的响应，然后转到B
这里我想截取来自 B 的响应

这是我的 Angular http 拦截器代码：

@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;
    });
  }
}

【问题讨论】：

浏览器确实支持这个，但你必须检查它并且没有办法进行 polyfill。你必须深入挖掘HttpInterceptor 或从头开始写一些东西。 developer.mozilla.org/en-US/docs/Web/API/Request/redirect
B 的最终响应不就是您收到的对原始 http 请求的最终响应吗？
不一定，这就是我想拦截它的原因：如果用户通过身份验证，则结果是原始请求的预期结果，如果不是，则为登录表单。我希望能够检查登录表单是否出现（好吧，只需检查内容类型是否为 html）并手动重定向浏览器而不必在任何地方添加该逻辑，只需在拦截器中
任何解决方案了吗？

标签： javascript ajax angular xmlhttprequest

【解决方案1】：

您应该从 http 响应中获取完整的标头。

{observe:"response"} 是 Angular http 客户端的神奇参数。所以试试这个

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)
  }

【讨论】：