feat(in-app): lazy local anonymous login

in-app/v1/src/App/index.tsx

@@ -1,7 +1,7 @@
 import { Suspense, useEffect, useMemo } from 'react';
 import { BrowserRouter, Route, Routes } from 'react-router-dom';
 import { useTranslation } from 'react-i18next';
-import { decodeQueryParams, JsonParam, StringParam } from 'serialize-query-params';
+import { decodeQueryParams, JsonParam } from 'serialize-query-params';
 import { parse } from 'query-string';
 import { Helmet, HelmetProvider } from 'react-helmet-async';
 
@@ -34,6 +34,11 @@ import Test from './Test';
 
 function RequireAuth({ children }: { children: JSX.Element }) {
   const { user, loading, error } = useAuth();
+
+  useAutoLogin({
+    strategies: [loginByLocalAnonymousId],
+  });
+
   if (loading) {
     return <Loading fullScreen />;
   }
@@ -77,13 +82,11 @@ export default function App() {
   }, []);
 
   useAutoLogin({
-    hash: params,
     strategies: [
       loginByAnonymousId,
       loginByXDAccessToken,
       loginByTDSCredential,
       loginByJWT,
-      loginByLocalAnonymousId,
       loginByCurrentUser,
     ],
   });
@@ -151,11 +154,6 @@ function useHashConfiguration() {
         {
           meta: JsonParam,
           fields: JsonParam,
-          'anonymous-id': StringParam,
-          'xd-access-token': StringParam,
-          'tds-credential': StringParam,
-          credential: StringParam,
-          'associate-anonymous-id': StringParam,
         },
         parse(window.location.hash)
       ),

in-app/v1/src/auth/index.tsx

@@ -4,7 +4,7 @@ import { User } from 'open-leancloud-storage/auth';
 import { customAlphabet } from 'nanoid';
 
 import { auth, http } from '@/leancloud';
-import { useSetAuth } from '@/states/auth';
+import { useAuthState } from '@/states/auth';
 
 async function login(data: any) {
   let sessionToken: string;
@@ -81,17 +81,20 @@ export const loginByLocalAnonymousId: Strategy = async ({ query }) => {
   return login({ type: 'anonymous', anonymousId });
 };
 
+const { hash: hashSnapshot, search: searchSnapshot } = window.location;
+
 interface UseAuthLoginOptions {
   strategies: Strategy[];
-  hash: Record<string, any>;
 }
 
-export function useAutoLogin({ strategies, hash }: UseAuthLoginOptions) {
-  const setAuth = useSetAuth();
+export function useAutoLogin({ strategies }: UseAuthLoginOptions) {
+  const [auth, setAuth] = useAuthState();
   useEffect(() => {
+    if (auth.user) return;
     const autoLogin = async () => {
       setAuth({ loading: true });
-      const query = parse(window.location.search);
+      const query = parse(searchSnapshot);
+      const hash = parse(hashSnapshot);
       for (const strategy of strategies) {
         try {
           const user = await strategy({ hash, query });

in-app/v1/src/states/auth.ts

@@ -1,5 +1,5 @@
 import { User } from 'open-leancloud-storage/auth';
-import { atom, useRecoilValue, useSetRecoilState } from 'recoil';
+import { atom, useRecoilState, useRecoilValue, useSetRecoilState } from 'recoil';
 
 interface AuthState {
   user?: User;
@@ -9,8 +9,13 @@ interface AuthState {
 
 const authState = atom<AuthState>({
   key: 'auth',
+  default: {},
 });
 
+export function useAuthState() {
+  return useRecoilState(authState);
+}
+
 export function useSetAuth() {
   return useSetRecoilState(authState);
 }