fix: 活体认证测试 新版

Author: dongfengtao

packages/guard-core-v4/src/MFA/core/face.tsx

@@ -10,6 +10,8 @@ import { useGuardButtonState } from '../../_utils/context'
 
 import { MfaBusinessAction, useMfaBusinessRequest } from '../businessRequest'
 
+import { AwsFaceLivenessDetector } from './AwsFaceLivenessDetector'
+
 const { useEffect, useState } = React
 
 // ============================================
@@ -19,6 +21,12 @@ interface LivenessSessionResponse {
   sessionId: string
   region: string
   expireTime?: number
+  credentials?: {
+    AccessKeyId: string
+    SecretAccessKey: string
+    SessionToken: string
+    Expiration?: Date
+  }
 }
 
 // ============================================
@@ -49,6 +57,11 @@ export const MFAFace = (props: any) => {
     null
   )
   const [livenessRegion, setLivenessRegion] = useState<string>('')
+  const [livenessCredentials, setLivenessCredentials] = useState<{
+    accessKeyId: string
+    secretAccessKey: string
+    sessionToken: string
+  } | null>(null)
   const [isLoadingSession, setIsLoadingSession] = useState(false)
   const [livenessResult, setLivenessResult] = useState<LivenessResult | null>(
     null
@@ -63,61 +76,100 @@ export const MFAFace = (props: any) => {
    * 创建 AWS 活体检测 Session
    */
   const createLivenessSession = async () => {
+    console.log(
+      '[FaceLiveness] 开始创建 session, mfaToken:',
+      props.initData.mfaToken
+    )
     setIsLoadingSession(true)
     setLivenessResult(null)
 
     try {
       const result = await getLivenessSessionRequest({
         mfaToken: props.initData.mfaToken
       })
+      console.log('[FaceLiveness] 创建 session 响应:', result)
 
       // 适配后端返回格式：可能是 result.data 或直接在 result 上
       const responseData = result.data || result
+      console.log('[FaceLiveness] 解析后的 responseData:', responseData)
+
       const sessionData: LivenessSessionResponse = responseData
 
+      console.log('[FaceLiveness] sessionId:', sessionData.sessionId)
+      console.log('[FaceLiveness] region:', sessionData.region)
+      console.log('[FaceLiveness] credentials:', sessionData.credentials)
+
       setLivenessSessionId(sessionData.sessionId)
       setLivenessRegion(sessionData.region)
+
+      // 保存 AWS 临时凭证
+      if (sessionData.credentials) {
+        console.log('[FaceLiveness] 保存临时凭证')
+        setLivenessCredentials({
+          accessKeyId: sessionData.credentials.AccessKeyId,
+          secretAccessKey: sessionData.credentials.SecretAccessKey,
+          sessionToken: sessionData.credentials.SessionToken
+        })
+      }
     } catch (e: any) {
-      console.error('Failed to create liveness session', e)
+      console.error('[FaceLiveness] 创建 session 失败:', e)
       message.error(e.message || '创建活体检测会话失败')
     }
 
     setIsLoadingSession(false)
+    console.log('[FaceLiveness] 创建 session 结束')
   }
 
   /**
    * 获取活体检测结果
    */
   const fetchLivenessResult = async () => {
-    if (!livenessSessionId) return
+    if (!livenessSessionId) {
+      console.log('[FaceLiveness] 没有 sessionId，跳过获取结果')
+      return
+    }
 
+    console.log(
+      '[FaceLiveness] 开始获取检测结果, sessionId:',
+      livenessSessionId
+    )
     spinChange(true)
 
     try {
       const result = await getLivenessResultRequest({
         sessionId: livenessSessionId,
         mfaToken: props.initData.mfaToken
       })
+      console.log('[FaceLiveness] 获取检测结果响应:', result)
 
       // 适配后端返回格式
       const responseData = result.data || result
+      console.log('[FaceLiveness] 解析后的 livenessData:', responseData)
+
       const livenessData: LivenessResult = responseData
       setLivenessResult(livenessData)
 
+      console.log('[FaceLiveness] isLive:', livenessData.isLive)
+      console.log('[FaceLiveness] confidence:', livenessData.confidence)
+      console.log('[FaceLiveness] status:', livenessData.status)
+
       // 根据结果处理登录
       if (livenessData.isLive) {
+        console.log('[FaceLiveness] 活体检测通过，调用 mfaLogin')
         // 活体检测通过，调用验证接口
         props.mfaLogin(200, responseData)
       } else {
+        console.log('[FaceLiveness] 活体检测未通过')
         // 未通过，显示重试
         message.error(livenessData.message || '活体检测未通过')
       }
     } catch (e: any) {
-      console.error('Failed to get liveness result', e)
+      console.error('[FaceLiveness] 获取检测结果失败:', e)
       message.error(e.message || '获取检测结果失败')
     }
 
     spinChange(false)
+    console.log('[FaceLiveness] 获取检测结果结束')
   }
 
   /**
@@ -140,13 +192,6 @@ export const MFAFace = (props: any) => {
   // 渲染 AWS 活体检测组件
   // ============================================
   const renderAwsLivenessDetector = () => {
-    // 动态导入 AWS 组件（避免影响原有打包）
-    const AwsFaceLivenessDetector = React.lazy(() =>
-      import('./AwsFaceLivenessDetector').then(module => ({
-        default: module.AwsFaceLivenessDetector
-      }))
-    )
-
     if (isLoadingSession) {
       return (
         <div
@@ -157,35 +202,27 @@ export const MFAFace = (props: any) => {
       )
     }
 
-    // if (!livenessSessionId) {
-    //   return (
-    //     <div style={{ textAlign: 'center', padding: '2rem' }}>
-    //       <p>无法创建检测会话</p>
-    //       <SubmitButton
-    //         onClick={createLivenessSession}
-    //         text="重试"
-    //         className="mfa-face"
-    //       />
-    //     </div>
-    //   )
-    // }
+    if (!livenessSessionId) {
+      return (
+        <div style={{ textAlign: 'center', padding: '2rem' }}>
+          <p>无法创建检测会话</p>
+          <SubmitButton
+            onClick={createLivenessSession}
+            text="重试"
+            className="mfa-face"
+          />
+        </div>
+      )
+    }
 
     return (
-      <React.Suspense
-        fallback={<div className="authing-g2-loading">加载组件...</div>}
-      >
-        <AwsFaceLivenessDetector
-          sessionId={livenessSessionId || ''}
-          region={livenessRegion}
-          onAnalysisComplete={handleLivenessAnalysisComplete}
-          onError={handleLivenessError}
-          credentials={{
-            accessKeyId: '',
-            secretAccessKey: '',
-            sessionToken: ''
-          }}
-        />
-      </React.Suspense>
+      <AwsFaceLivenessDetector
+        sessionId={livenessSessionId || ''}
+        region={livenessRegion}
+        onAnalysisComplete={handleLivenessAnalysisComplete}
+        onError={handleLivenessError}
+        credentials={livenessCredentials || undefined}
+      />
     )
   }