Http拦截器错误响应在chrome中完成

Question

I am facing weird issue while working with httpinterceptor in angular 5. I am not able to get the error response and error status code in Chrome and but able to get in IE below is my HttpInterceptor code.

import { Injectable } from '@angular/core';
import { HttpInterceptor, HttpRequest, HttpHandler, HttpResponse } 
from '@angular/common/http';
import { finalize, tap } from 'rxjs/operators';

@Injectable()
export class LoggingInterceptor implements HttpInterceptor {
intercept(req: HttpRequest<any>, next: HttpHandler) {
const startTime = Date.now();
let status: string;

return next.handle(req).pipe(
    tap(
      event => {
        status = '';
        if (event instanceof HttpResponse) {
          status = 'succeeded';
        }
      },
      error => {
        if(error instanceof HttpErrorResponse)  {
          console.log(error.error.message) 
          // Above message is printing in IE but no in chorme.
       }
     }
    ),
    finalize(() => {

    })
);
 }

} 

In the above Error block the message and status code I am able to see in IE but not in Chrome. Kindly help me how to resolve this.

Edit: I am consuming data from different origin and cors is enabled in web services

Answer 1

I found the issue, It is due to not setting response headers on errors at server side. Server is throwing exception directly for errors without setting response headers. I have set response headers at server side and now I am able to see the error message in chrome.

Still I am confused how come IE able to respond on this errors.

Answer 2

You are missing the HttpErrorResponse import, a more browser agnostic approach would be to look at the error status, rather than the error message.

  if (err instanceof HttpErrorResponse) {
      console.log(err.status);
  }

I believe IE uses Friendly error messages where other browsers don't https://blogs.msdn.microsoft.com/ieinternals/2010/08/18/friendly-http-error-pages/

Here's a fairly up to date Medium article on Interceptors and usage which may clarify some things https://medium.com/@ryanchenkie_40935/angular-authentication-using-the-http-client-and-http-interceptors-2f9d1540eb8

Hope this helps