在 flutter for web 中实现访客计数器

Implementing visitor counter in flutter for web

我正在尝试在一个完全由 flutter-web 构建的网站上实现一个 visitor-counter,并且我正在尝试仅使用普通的 dart 代码和一些来自 pub.dev 的包来实现这一点].

但一直困扰我的问题是我需要找到一种方法来根据用户的浏览器或设备唯一地识别用户,这样我就不会一次又一次地为同一个人增加计数器重访后。

到目前为止,我认为我可以使用 firestore for keeping track of the total number of visitors and display the same on the webpage upon startup and use some caching package like dcache or localstorage (like described here) 来跟踪重新访问同一网页的用户。

有没有更好的方法来解决这个问题?任何帮助将不胜感激

(ps: 我以前没有网络开发经验)

既然你说到用户,我马上就想到了使用Firebase Authentication。

这里有两种使用方式:

  1. 使用匿名身份验证,您可以为每个用户创建一个唯一的 ID,而无需他们输入凭据。

  2. 如果您希望能够在不同的 browsers/devices 上识别同一用户,他们将必须使用受支持的提供商之一登录(email/password,phone 号码、电子邮件 link、facebook、google 等)。

无论您选择哪一个,每个用户现在都会有一个唯一的 ID(在 Firebase 术语中称为 UID),您可以使用它在数据库中识别他们。例如,您可以为数据库中的每个用户创建一个文档,并将他们的 UID 作为该文档的 ID。这样您就可以保证每个用户只有一个文档。

您仍然需要计算文件数量,为此我建议查看 distributed counter extension


还要考虑您是否想在这里使用 Firebase 实时数据库而不是 Firestore,因为它可能会为您提供更简单的定价模型,并且具有内置 presence system。您仍然会像以前一样使用 Firebase 身份验证,但只需交换数据库。

如果您只想捕获您的网络应用程序上的访问者数量,则有一种捷径。 我在 firestore 中创建了一个名为“Visits”的集合,并生成了自动 ID,我在其中添加了一个名为“count”的字段。而已! 现在您只需在第一个屏幕的 init 方法中调用此方法即可:

updateCounter() async {
final cRef = FirebaseFirestore.instance.collection('VISITS');
await cRef
    .doc("mS9fCXjvkpREt8LvanSb") //Paste the id which was generated automatically
    .set({"count": FieldValue.increment(1)}, SetOptions(merge: true));

}