Является ли HTTP-ответ одним элементом в потоке Observable (Rx js)? - PullRequest
Новая
       4

Является ли HTTP-ответ одним элементом в потоке Observable (Rx js)?

1 голос
/ 17 июня 2020

В настоящее время я расширяю свои знания о Rx Js и пытаюсь лучше понять потоки. Я хотел бы сравнить ответ Http с Observable, созданным с помощью ().

Можно ли сказать, что ответ JSON обрабатывается как элемент 'a' при сравнении его с of(['a', 'b', 'c'])? Когда мы получаем ответ JSON, это всегда похоже на получение только одного элемента?

Является ли HTTP-ответ одним элементом в наблюдаемом потоке?

РЕДАКТИРОВАТЬ: Очевидно, я должен был сравнить это первое испускаемое значение interval ().

1 Ответ

2 голосов
/ 17 июня 2020

HTTP-запрос, использующий Angular HTTP-клиент, на самом деле является наблюдаемым Rx JS типа HttpRequest, который создает поток уведомлений типа HttpEvent . Если у вас wi sh, чтобы увидеть все уведомления, используйте опцию observe: 'events' в запросе. Если эта опция не указана (по умолчанию), возвращается только последнее уведомление (результат HTTP-запроса), как показано здесь .

From docs :

При использовании HttpClient.request() с методом HTTP настройте метод с помощью observe: 'events', чтобы видеть все события, включая ход передачи.

Видя это, ваш пример of(['a', 'b', 'c']) не похож на HTTP-запрос, поскольку он выдает только одно уведомление (массив ['a', 'b', 'c']) и завершается. Однако from(['a', 'b', 'c']) похож на HTTP-запрос, поскольку он генерирует каждый элемент индивидуально.

Является ли HTTP-ответ одним элементом в наблюдаемом потоке?

Да, это последний уведомление в потоке уведомлений. Это тип HttpEventType.Response.

Рабочий пример: Stackblitz 

import { Component, OnInit } from '@angular/core';
import { HttpClient, HttpEvent, HttpEventType } from '@angular/common/http';

@Component({ selector: 'app', templateUrl: 'app.component.html' })
export class AppComponent implements OnInit {
  events = [];

  constructor(private http: HttpClient) { }

  ngOnInit() {      
    this.http.get<any>('https://jsonplaceholder.typicode.com/todos/1', {observe: 'events'}).subscribe((event: HttpEvent<any>) => {
      this.events.push(event);
      console.log(event);
    });
  }
}

Консольный вывод enter image description here

type: 0 соответствует HttpEventType.Sent, а type: 4 соответствует HttpEventType.Response. Вы могли бы увидеть больше событий в более сложном запросе (например, в запросе на загрузку видео).

...