Merge pull request #112 from ant-xuexiao/feat/support-anoymous-login

feat: support anoymous login

Author: xingwanying

.gitignore

@@ -1,6 +1,7 @@
 # See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
 __pycache__/
 *.pyc
+**/*.pyc
 # dependencies
 node_modules/
 

client/app/hooks/useFingerprint.ts

@@ -0,0 +1,10 @@
+import useSWR from 'swr';
+import FingerprintJS from '@fingerprintjs/fingerprintjs'
+
+export function useFingerprint() {
+  return useSWR(['client.fingerprint'], async () => {
+    const fpPromise = FingerprintJS.load();
+    const fp = await fpPromise;
+    return fp.get();
+  }, { suspense: false })
+}

client/app/hooks/useUser.ts

@@ -1,15 +1,18 @@
+'use client';
+
 import {
   getUserInfo
 } from '@/app/services/UserController';
 import { useQuery } from '@tanstack/react-query';
-
-
+import { useFingerprint } from './useFingerprint';
 
 function useUser() {
-  const apiDomain = process.env.NEXT_PUBLIC_API_DOMAIN;
+  const { data } = useFingerprint();
+
   return useQuery({
-    queryKey: [`user.userinfo`],
-    queryFn: async () => getUserInfo(),
+    queryKey: [`user.userinfo`, data?.visitorId],
+    queryFn: async () => getUserInfo({ clientId: data?.visitorId }),
+    enabled: !!data?.visitorId,
     retry: false,
   });
 }

client/app/services/UserController.ts

@@ -1,10 +1,8 @@
 import axios from 'axios';
 
-
 //  Get the public bot profile by id
-export async function getUserInfo() {
-  
+export async function getUserInfo({ clientId }: { clientId?: string }) {
   const apiDomain = process.env.NEXT_PUBLIC_API_DOMAIN;
-  const response = await axios.get(`${apiDomain}/api/auth/userinfo`);
+  const response = await axios.get(`${apiDomain}/api/auth/userinfo?clientId=${clientId}`);
   return response.data.data;
 }

client/components/User.tsx

@@ -1,11 +1,13 @@
+'use client';
+
 import { Avatar, Button, Link } from '@nextui-org/react';
 import useUser from '../app/hooks/useUser';
 
 export default function Profile() {
-  const { data: user } = useUser();
+  const { data: user, status } = useUser();
   const apiDomain = process.env.NEXT_PUBLIC_API_DOMAIN;
 
-  if (!user) {
+  if (!user || status !== "success") {
     return (
       <Button as={Link} color="primary" href={`${apiDomain}/api/auth/login`} variant="flat">
         Login

client/package.json

@@ -16,6 +16,7 @@
   },
   "dependencies": {
     "@auth0/nextjs-auth0": "^3.3.0",
+    "@fingerprintjs/fingerprintjs": "^4.3.0",
     "@next/bundle-analyzer": "^13.4.19",
     "@nextui-org/react": "^2.2.9",
     "@supabase/supabase-js": "^2.32.0",
@@ -28,7 +29,6 @@
     "axios": "^1.6.7",
     "concurrently": "^8.2.2",
     "dayjs": "^1.11.10",
-    "petercat-lui": "^0.0.8",
     "eslint": "8.46.0",
     "eslint-config-next": "13.4.12",
     "framer-motion": "^10.16.15",
@@ -38,6 +38,7 @@
     "lodash": "^4.17.21",
     "next": "14.0.1",
     "openai": "^4.24.7",
+    "petercat-lui": "^0.0.8",
     "postcss": "8.4.27",
     "react": "18.2.0",
     "react-dom": "18.2.0",