Angular Universal, приложение не загрузится, пока дважды не щелкнет «обновить»

Я создаю универсальное приложение Angular. Недавно я добавил преобразователь маршрута и начал наблюдать это странное поведение, когда я запускаю npm run dev:ssr, страница не загружается, пока я дважды не нажму кнопку перезагрузки.

1-й: щелчок: браузер вращается и, похоже, не истекает время ожидания ...

2-й щелчок: страница загружается

Вот мой репозиторий github. Я подозреваю, что это как-то связано с моим преобразователем маршрутов, который просто извлекает данные из Firestore и помещает их в TransferState. Вот резольвер для удобства:

import { Inject, Injectable, PLATFORM_ID } from '@angular/core';
import { ActivatedRouteSnapshot, Resolve, RouterStateSnapshot } from '@angular/router';
import { Observable, of } from 'rxjs';
import { isPlatformServer } from '@angular/common';
import { makeStateKey, TransferState } from "@angular/platform-browser";
import { Restaurant } from '../restaurants/Interfaces.model';
import { AngularFirestore } from '@angular/fire/firestore';
import { first, tap } from 'rxjs/operators';


@Injectable()
export class RestaurantResolver implements Resolve<Restaurant> {

    constructor(
        public afs: AngularFirestore,
        private transferState: TransferState,
        @Inject(PLATFORM_ID) private platformId) {

    }

    async resolve(route: ActivatedRouteSnapshot,
        state: RouterStateSnapshot): Promise<Restaurant> {

        console.info('platformId', this.platformId)

        const rId = route.url[1].path;

        const restaurantId = makeStateKey<Restaurant>("restaurant-" + rId);

        if (this.transferState.hasKey(restaurantId)) {

            console.info('has key', restaurantId)


            const restaurant = this.transferState.get(restaurantId, null);

            this.transferState.remove(restaurantId);

            return restaurant;
        }
        else {

            let result: Restaurant = (await this.afs.doc('restaurants/' + rId).get().toPromise()).data() as Restaurant
            if (isPlatformServer(this.platformId)) {
                this.transferState.set(restaurantId, result);
            }
            return result;
        }
    }
}
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
3
0
338
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Оказывается, в библиотеке AngularFire есть ошибка, из-за которой наблюдаемые объекты не завершаются, это данное поведение.

Я столкнулся с той же проблемой... Какая версия вызывает у вас проблему? А вы нашли стабильную версию?

Blasco 13.01.2021 12:08

Не могли бы вы поделиться дополнительной информацией об ошибке? а можно ссылку на тему в гитхабе?

Blasco 13.01.2021 21:21

Как вы решили это?

Ross Rawlins 08.06.2022 18:30

Другие вопросы по теме