Я не знаю, почему мой http-запрос не работает в моем angular проекте?

Question

Я создал RESTful API с node.js, и когда я тестировал его с почтальоном, он работал правильно и показал правильный результат.

Но моя проблема в запросе от моего angular приложения. когда я отправляю запрос, в API нет реакции, и кажется, что на сервер вообще не отправляется запрос!

URL моего API:

http://localhost:3000/api/menus/menujsonexport

И когда я отправляю запрос через почтальона он возвращает json правильно.

А вот мой скрипт запроса в angular:

private requestMenu(type: 'listsidemenu'): Observable<any> {
  let base;
  if (type === 'listsidemenu') {
    base = this.http.get<any>('http://localhost:3000/api/menus/menujsonexport'
            , { headers: { Authorization: `Bearer ${this.getToken()}` }});
  }

  const requestMenu = base.pipe(
    map((data: any) => {
      return data;
    })
  );
  return requestMenu;
}

Я вызвал запрос с помощью этого метода:

public fetchjsonmenu() {
  this.authserv.listSideMenu()
  .pipe(
    finalize(() => {console.log('finished'); }),
    tap(x => {
      console.log(x);
    })
  );
}

Но в моем nodejs API нет реакции.

У вас есть идеи?

Скажите, пожалуйста, не хватает информации, чтобы ответить на этот вопрос.

Answer 1

Наблюдаемый экземпляр начинает публиковать значения только тогда, когда кто-то подписывается на него. Вы подписываетесь, вызывая метод subscribe () экземпляра, передавая объект-наблюдатель для получения ответа.

.subscribe - это не Angular2.

Это метод, полученный из rx js библиотека, которую Angular использует для внутреннего использования.

Если вы можете представить себя при подписке на рассылку и после подписки, каждый раз, когда появляется новая рассылка, они отправят ее к вам домой ( вызывается метод внутри подписки).

Вот что происходит, когда вы подписываетесь на источник журналов (который они называют Observable в библиотеке rxjs)

Все вызовы AJAX в Angular использует эту библиотеку за кулисами, и для того, чтобы использовать любую из них, вы должны использовать имя метода, например, get, а затем вызвать на нем подписку, потому что get возвращает и Observable.

Кроме того, когда вы делаете это, <button (click)="doSomething()"> Angular использует Observables за сценой и подписывает вас на этот источник вещей, который в данном случае является событием click.

Возвращаясь к нашей аналогии с Observables и newsletter stores, после того, как вы подпишетесь, как только и когда появится новый журнал, они отправят его вам, если вы не go, и откажетесь от них, что для чтобы это произошло, вы должны запомнить номер подписки или идентификатор, который в rx js будет выглядеть так:

let subscription = magazineStore.getMagazines().subscribe(
   (newMagazine)=>{

         console.log('newMagazine',newMagazine);

    }); 

А когда вы больше не хотите получать журналы:

   subscription.unsubscribe();

Кроме того, то же самое относится к

 this.route.paramMap

, который возвращает Observable, а затем вы подписываетесь на него.

Мой личный взгляд rxjs была одной из величайших вещей, которые были принесены в JavaScript мир, и еще лучше в Angular.

Есть 150 ~ rxjs методов (очень похожих на lodash методы) и один то, что вы используете, называется switchMap

Answer 2

Вам нужно добавить .subscribe() в ваш код после получения вызова. Для получения дополнительной информации проверьте ссылку . Итак, теперь ваш скрипт должен выглядеть примерно так:

  let base;
  if (type === 'listsidemenu') {
    base = this.http.get<any>('http://localhost:3000/api/menus/menujsonexport'
            , { headers: { Authorization: `Bearer ${this.getToken()}` }}).subscribe();
  }

  const requestMenu = base.pipe(
    map((data: any) => {
      return data;
    })
  );
  return requestMenu;
}```