В моем приложении Angular есть домашний компонент, который загружает содержимое профиля из Firestore через предоставленный URL-адрес (например, mypage.com/username ищет профиль с именем «username»). Теперь я думал, что это работает нормально, но заметил очень странное поведение:
- загрузка профиля в активной вкладке (то есть пользователь в данный момент находится на этой вкладке) всегда загружает профиль
- открытие профиля в новой, в настоящее время неактивной вкладке (то есть пользователь в настоящее время все еще открыл другую вкладку) и возможность полной загрузки вкладки также работает
- открытие профиля в новой вкладке и переключение на него, пока это при продолжающейся загрузке выдается следующая ошибка: Не удалось связаться с бэкэндом Firestore. Сервер не ответил в течение 10 секунд ...
В последнем случае Firestore выдает ошибку, а запрос просто возвращает пустой массив. В этот момент я обычно показываю сообщение 404, потому что я предполагаю, что профиль не может быть найден (хотя в этом случае он существует). Если эта ошибка возникает, запрос Firestore все еще возвращает объект результата, когда вкладка становится активной (пользователь переключается на эту вкладку), но имейте в виду, что это происходит ПОСЛЕ того, как он уже выдал ошибку и возвратил пустой массив (и мои действия (показать 404) ) основаны на первом результате)
Я использую @ angular / fire 6.0.0, но такое поведение также существует в предыдущих версиях, таких как 5.2.3.
app-routing.module.ts
const routes: Routes = [
{ path: '', component: LandingComponent },
{ path: 'login', component: LoginComponent },
{ path: ':id', component: HomeComponent }
];
home.component.ts:
ngOnInit() {
this.route.paramMap.subscribe(param => {
let routeParam = param.get("id").toLowerCase()
this.firebaseServcie.queryProfileByUniqueName(routeParam).subscribe(res => {
if (res.length > 0) {
//profile found ... some further actions
}
else {
//profile not found ... usually show 404 message
}
});
}
}
firebase.service.ts:
queryProfileByUniqueName(uniqueName: string): Observable<Profile[]> {
return this.firestore.collection<Profile>("profiles", ref => ref.where('uniqueName', '==', uniqueName))
.valueChanges();
}
Я сделал обходной путь путем итерации с ngFor над массивом Obervable с использованием канала async. Этот тип решает мою проблему, но ошибка все равно возникает, как я описал выше. Я бы очень хотел узнать, если это проблема с моей стороны или из Firebase.