fix(Auth): deviceId get 逻辑

src/components/Login/LoginForm.tsx

@@ -4,7 +4,6 @@ import React, { useState, useMemo, useEffect } from 'react';
 
 import { debounce } from 'lodash';
 import { useRouter } from 'next/navigation';
-import { v4 as uuidv4 } from 'uuid';
 import { useShallow } from 'zustand/react/shallow';
 
 import { useToast } from '@/components/ui/use-toast';
@@ -13,6 +12,7 @@ import { Button } from '@/components';
 import { useLogin, useLoginRedirect } from '@/hooks';
 import { apiSendSMS } from '@/services';
 import { useUserStore } from '@/store';
+import { createDeviceId, getDeviceId } from '@/utils';
 
 export default function LoginForm({ className }: { className?: string }) {
   const redirect = useLoginRedirect();
@@ -40,8 +40,7 @@ export default function LoginForm({ className }: { className?: string }) {
     setBtnLoading(true);
 
     // 生成 deviceId
-    const uuid: string = uuidv4();
-    localStorage.setItem('deviceId', uuid);
+    const deviceId = createDeviceId();
 
     // 设置倒计时
     const gapTime: number = 59;
@@ -50,7 +49,7 @@ export default function LoginForm({ className }: { className?: string }) {
       setBtnLoading(false);
     }, gapTime * 1000);
 
-    const result = await apiSendSMS({ mobile: phone, deviceId: uuid });
+    const result = await apiSendSMS({ mobile: phone, deviceId });
 
     if (result.code !== 200) {
       // 显示错误信息
@@ -72,8 +71,9 @@ export default function LoginForm({ className }: { className?: string }) {
   const handleLogin = async () => {
     if (disLogin) return;
     setBtnLoading(true);
-    const uuid = localStorage.getItem('deviceId') || 'error';
-    const result = await SmsLogin({ phone, authCode: authCode, deviceId: uuid });
+
+    const deviceId = getDeviceId();
+    const result = await SmsLogin({ phone, authCode: authCode, deviceId });
     if (result.code === 200) {
       setShowLogin(false);
       await getUserInfo();

src/hooks/useLogin.ts

@@ -1,7 +1,7 @@
 import { jwtDecode } from 'jwt-decode';
 
 import { apiUserLogin, apiAutoLogin } from '@/services';
-import { setAccessToken, getAuthorization, clearAccessToken } from '@/utils';
+import { setAccessToken, getAuthorization, clearAccessToken, getDeviceId } from '@/utils';
 
 export const SmsLogin = async ({
   phone,
@@ -31,8 +31,8 @@ export const autoLogin = async () => {
   }
 
   // 如果有 token，则触发 autoLogin 接口
-  const uuid = localStorage.getItem('deviceId') || 'error';
-  const result = await apiAutoLogin({ deviceId: uuid });
+  const deviceId = getDeviceId();
+  const result = await apiAutoLogin({ deviceId: deviceId });
   if (result.code === 200) {
     const jwt = result.data;
     const { exp } = parseJWT(jwt);

src/utils/deviceId.ts

@@ -0,0 +1,18 @@
+import { v4 as uuidv4 } from 'uuid';
+
+export const createDeviceId = () => {
+  const uuid: string = uuidv4();
+  localStorage.setItem('deviceId', uuid);
+  return uuid;
+};
+
+export const getDeviceId = () => {
+  const localDeviceId = localStorage.getItem('deviceId');
+  if (localDeviceId) {
+    return localDeviceId;
+  } else {
+    // localStorge 中没有 deviceId，则创建一个
+    const deviceId = createDeviceId();
+    return deviceId;
+  }
+};

src/utils/index.ts

@@ -4,3 +4,4 @@ export * from './time';
 export * from './ua';
 export * from './ui';
 export * from './auth';
+export * from './deviceId';