Search code examples
flutterdartgoogle-cloud-firestorecounterflutter-web

Implementing visitor counter in flutter for web


I'm trying to implement a visitor-counter on a website built entirely with flutter-web and I'm trying to accomplish this with nothing but plain dart code and some packages from pub.dev.

But the problem which has been bugging me is that I need to find a way to uniquely identify users based on their browsers or their devices so that I don't end up incrementing the counter for the same person again and again upon a revisit.

So far what I've thought is that I could use 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) to keep track of users who are re-visiting the same webpage.

Is there any better approach to this problem? Any help would be appreciated 😁

(ps: I have no prior web dev experience)


Solution

  • Since you talk about users, I immediately think of using Firebase Authentication.

    There are two ways you could use that here:

    1. With anonymous authentication, you could create a unique ID for each user without requiring them to enter credentials.

    2. If you want to be able to identify the same user on different browsers/devices, they will have to sign in with one of the supported providers (email/password, phone number, email link, facebook, google, etc).

    No matter which one you choose, each user will now have a unique ID (called UID in Firebase terms), which you can use to identify them in the database. For example, you could create a document for each user in the database with their UID as the ID of that document. That way you're guaranteed that each user will have no more than a single document.

    You'll still need to count the documents, for which I recommend checking out the distributed counter extension.


    Also consider if you want to use the Firebase Realtime Database instead of Firestore here, as it might give you a simpler pricing model, and has a built-in presence system. You'd still use Firebase Authentication as before, but just swap the database.