Angular2 Запрос REST Код статуса HTTP 401 изменяется на 0

Question

Я разрабатываю приложение Angular2. Кажется, что, когда мой токен доступа истекает, код статуса 401 HTTP изменяется в значение 0 в объекте Response. Я получаю 401 Unauthorized, но объект ответа ERROR имеет статус 0. Это мешает мне захватить ошибку 401 и попытаться обновить токен. Что вызывает изменение кода статуса HTTP 401 в код состояния HTTP 0?

Вот скриншот из консоли Фирефокса:

Вот мой код:

get(url: string, options?: RequestOptionsArgs): Observable<any> 
{ 
    //console.log('GET REQUEST...', url); 

    return super.get(url, options) 
     .catch((err: Response): any => 
     { 
      console.log('************* ERROR Response', err); 

      if (err.status === 400 || err.status === 422) 
      { 
       return Observable.throw(err); 
      } 
      //NOT AUTHENTICATED 
      else if (err.status === 401) 
      {     
       this.authConfig.DeleteToken(); 
       return Observable.throw(err); 
      }    
      else 
      { 
       // this.errorService.notifyError(err); 
       // return Observable.empty(); 
       return Observable.throw(err); 
      } 
     }) 
     // .retryWhen(error => error.delay(500)) 
     // .timeout(2000, new Error('delay exceeded')) 
     .finally(() => 
     { 
      //console.log('After the request...'); 
     }); 
} 

Этот код находится в таможенной службы HTTP, который простирается HTTP Angular2 так что я могу перехватить ошибки в одном место нахождения.

В Google Chrome, я получаю сообщение об ошибке:

XMLHttpRequest не может загрузить https://api.cloudcms.com/repositories/XXXXXXXXXXXXXXXX/branches/XXXXXXXXXXXXXXXX/nodesXXXXXXXXXXXXXXXX. В запрошенном ресурсе нет заголовка «Access-Control-Allow-Origin». Происхождение 'http://screwtopmedia.local.solutiaconsulting.com', следовательно, не допускается. Ответ получил код статуса HTTP 401.

Это сбивает с толку, потому что я включаю заголовок «Access-Control-Allow-Origin» в запросе.

Вот картина результатов, полученная в Google Chrome:

Я попытался доступ заголовка «WWW-Authenticate» Response как средство ловушки для 401. Однако, следующий код возвращает NULL:

err.headers.get("WWW-Authenticate") 

Это озадачивает, что я получаю вопрос CORS, потому что я не получаю никаких ошибок CORS при условии маркер доступа действителен.

Как заблокировать код статуса HTTP 401? Почему 401 код статуса HTTP изменяется на 0?

Благодарим за помощь.

Answer 1

Я работаю для Cloud CMS. Я могу подтвердить, что мы правильно настроили заголовки CORS для вызовов API. Однако для 401 ответов заголовки не устанавливаются должным образом. Это было решено, и исправление будет доступно в публичном API в конце этой недели.

BTW, если вы используете наш драйвер javascript https://github.com/gitana/gitana-javascript-driver вместо того, чтобы напрямую писать в API, тогда поток re-auth обрабатывается автоматически, и вам не нужно ломать ошибки 401.

Answer 2

Согласно W3C, если атрибут состояния установлен в 0, то это означает, что:

• Государство UNSENT или ОТКРЫТ.

или

• Флаг ошибки устанавливается.

Я думаю, что это не вопрос Angular2, похоже, что у вашего запроса возникли проблемы.

Answer 3

У меня была такая же проблема, и из-за того, что сервер не отправил правильный ответ (даже если в журнале консоли указано значение 401, Угловая ошибка имела статус 0). Мой сервер был Tomcat с Java-приложением, используя Spring MVC и Spring Security.

Он теперь работает с использованием folowing установки:

SecurityConfig.java

... 
protected void configure(HttpSecurity http) throws Exception { 
.... 
    http.exceptionHandling() 
      .accessDeniedHandler(accessDeniedHandler) 
      .authenticationEntryPoint(authenticationEntryPoint); 
    // allow CORS option calls 
    http.authorizeRequests().antMatchers(HttpMethod.OPTIONS, "/**").permitAll(); 
... 

SomeAuthenticationEntryPoint.java

@Component 
public class SomeAuthenticationEntryPoint implements AuthenticationEntryPoint { 

    @Override 
    public void commence(HttpServletRequest request, HttpServletResponse response, AuthenticationException authException) throws IOException, ServletException { 
    HttpStatus responseStatus = HttpStatus.UNAUTHORIZED; 
    response.sendError(responseStatus.value(), responseStatus.getReasonPhrase()); 
    } 
} 

web.xml

<error-page> 
    <error-code>403</error-code> 
    <location>/errors/unauthorised</location> 
</error-page> 
<error-page> 
    <error-code>401</error-code> 
    <location>/errors/unauthorised</location> 
</error-page> 

контроллера в час andle в/ошибки/... определенные ранее

@RestController 
@RequestMapping("/errors") 
public class SecurityExceptionController { 

    @RequestMapping("forbidden") 
    public void resourceNotFound() throws Exception { 
     // Intentionally empty 
    } 

    @RequestMapping("unauthorised") 
    public void unAuthorised() throws Exception { 
     // Intentionally empty 
     } 

    } 
} 

Answer 4

Вы должны использовать монитор протокола 3-й участник HTTP (как CharlesProxy), а не Chrome Dev инструменты, чтобы подтвердить, какие заголовки фактически направляются на службу API и если он возвращается к 401.

Answer 5

проблема связана с CORS просит см this github issue

Нет 'Access-Control-Allow-Origin' заголовок присутствует на запрошенный ресурс

означает, что в заголовках ответов требуется 'Access-Control-Allow-Origin'.

Угловые не получают какие-либо кодов состояния, поэтому он дает вам 0, которое вызывается браузер не позволяя xml parser разобрать response из-за недопустимый headers.

Необходимо добавить Заголовки CORS на ваш error response, а также success.

Answer 6

Если cloudcms.com делает, чтобы не установить Access-Control-Allow-Origin в ответе 401, то ничего вам не поделаешь. Вам необходимо открыть билет поддержки с ними, чтобы убедиться, что это нормальное поведение.

javascript в браузерах (FF, Chrome & Safari) Я тестировал, не получал никакой информации, если произошла ошибка CORS, отличная от состояния 0. Угловое2 не имеет никакого контроля над этим.

---

Я создал простой тест и получить тот же результат, как ваша:

geturl() { 
    console.log('geturl() clicked'); 
    let headers = new Headers({ 'Content-Type': 'application/xhtml+xml' }); 
    let options = new RequestOptions({ 'headers': headers }); 
    this.http.get(this.url) 
     .catch((error): any => { 
      console.log('************* ERROR Response', error); 
      let errMsg = (error.message) ? error.message : 
       error.status ? `${error.status} - ${error.statusText}` : 'Web Server error'; 
      return Observable.throw(error); 
     }) 
     .subscribe(
     (i: Response) => { console.log(i); }, 
     (e: any) => { console.log(e); } 
     ); 
} 

После долгих Googling, я обнаружил следующее (https://github.com/angular/angular.js/issues/3336):

lucassp прокомментировал 19 августа , 2013

Я нашел проблему некоторое время, но я забыл сообщение здесь, ответ. КАЖДЫЙ ответ, даже Ошибка 500, должен иметь прикрепленные заголовки CORS. Если сервер не прикрепляет заголовки CORS к ответу «Ошибка 500», объект XHR не будет анализировать его, поэтому объект XHR не будет иметь никакого тела ответа, статуса или любых других данных ответа внутри.

Результат от сетевого монитора Firefox, похоже, поддерживает указанную выше причину.

Javascript-запрос получит пустой ответ.

Plain URL запроса (копия & вставить ссылку в адресной строке) получит тело ответа

Javascript использовать XHRHttpRequest для HTTP связи.

При поступлении ответа XHR браузер обрабатывает заголовок, поэтому вы увидите эти 401 сетевые сообщения. Однако, если ответ XHR принадлежит другому хосту, то javascript И заголовок ответа не содержат заголовок CORS (например, Access-Control-Allow-Origin: *), браузер не передает никакой информации обратно на уровень XHR. В результате тело ответа будет полностью пустым без статуса (0).

Я тестировал с FF 48.0.1, Chrome 52.0.2743.116 и Safari 9.1.2, и все они имеют одинаковое поведение.

Используйте монитор сети браузера, чтобы проверить ответный заголовок для этих записей 401 Unauthorized, очень вероятно, что нет заголовка Access-Control-Allow-Origin и вызывает проблему, с которой вы сталкиваетесь. Это может быть ошибка или дизайн на стороне поставщика услуг.

Access-Control-Allow-Origin - ответ только HTTP-заголовка. Для получения дополнительной информации от https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS#The_HTTP_response_headers