Angular和Firebase - 自动数据库恢复

Question

我尝试创建一个网站，为我的学校作业提供课文。我已经完成了身份验证和课程备份。现在，我尝试创建一个实时聊天。但是，当我更改数据库时，有必要重新加载网站以进行更改。没有重装怎么办？

我加载脚本的服务：

import { HttpClient } from "@angular/common/http";
import { Injectable } from "@angular/core";

@Injectable()
export class CoursService {
  liste_cours = []

  constructor(private httpClient: HttpClient) {
    this.getCoursFromServer()
  }

  saveCoursToServer() {
    this.httpClient
      .put("https://databaselink/cours.json", this.liste_cours)
      .subscribe(
        () => {
          console.log("Enregistrement terminé!");
        },
        error => {
          console.log("Erreiorr ! : " + error);
        }
      );
  }

  getCoursFromServer() {
    this.httpClient
      .get<any[]>("https://databaselink/cours.json")
      .subscribe(
        response => {
          this.liste_cours = response;
          console.log("Loading finish");
        },
        error => {
          console.log("Error!: " + error);
        }
      );
  }
}

谢谢你的回答！

Answer 1

您似乎通过向其发出HTTP请求来访问Firebase实时数据库。这意味着您在进行HTTP调用时获取当前数据，但之后不会收到数据更新。当您重新加载页面时，您再次获取最新数据。

有几种方法可以在数据更改时自动更新页面，而无需用户重新加载页面。

1. 使用Firebase SDK。这是迄今为止最简单的方法，因为Firebase具有适用于普通JavaScript和Angular应用程序的SDK。当您集成这些SDK时，您可以通过attaching an on('value' listener或subscribing to the node获得实时更新。
2. 在页面中定期执行HTTP请求，这称为轮询数据。这也是一种非常简单的方法，但如果您的数据不经常更改，则会变得非常低效。
3. 为Firebase的流式REST API实现客户端。这非常复杂，通常只在没有Firebase SDK的平台上完成，或者由想要了解协议的更多信息的发烧友完成。

我强烈建议您按照给出的顺序考虑这些解决方案。