update

src/components/GenerateImg.vue

@@ -8,31 +8,75 @@ import { globalStore } from "../globalstore.js";
 import faceTemplate from "../static/ali_face_template.js";
 import MyPhoto from './MyPhoto.vue'
 import PhotoSquare from './PhotoSquare.vue'
+import { loadFaceApiModels, validateFaceInImage } from "../libs/faceValidator.js"
 
 defineProps({
   show: true
 })
 
-onMounted(() => {
+onMounted(async () => {
+  await loadFaceApiModels()
 })
 
 import { ElMessage } from 'element-plus';
 import { Plus } from '@element-plus/icons-vue';
 import { tr } from "element-plus/es/locales.mjs"
 const router = useRouter();
+
 // 上传前的校验
 const beforeUpload = (file) => {
+  // 基础格式校验
   const isJpgOrPng = file.type === 'image/jpeg' || file.type === 'image/png';
   if (!isJpgOrPng) {
     ElMessage.error('只能上传JPG或PNG格式的图片!');
     return false;
   }
+  
   const isLt2M = file.size / 1024 / 1024 < 5;
   if (!isLt2M) {
     ElMessage.error('图片大小不能超过5MB!');
     return false;
   }
-  return true;
+  
+  return new Promise(async (resolve) => {
+    const loadingInstance = ElMessage({
+      message: '正在验证人脸...',
+      type: 'info',
+      duration: 0,
+      showClose: false
+    });
+    
+    try {
+      const faceValidationResult = await validateFaceInImage(file);
+      loadingInstance.close();
+      
+      if (!faceValidationResult.success) {
+        ElMessage({
+          message: faceValidationResult.message,
+          type: 'error',
+          duration: 4000
+        });
+        resolve(false);
+      } else {
+        ElMessage({
+          message: faceValidationResult.message,
+          type: 'success',
+          duration: 2000
+        });
+        resolve(true);
+      }
+      
+    } catch (error) {
+      loadingInstance.close();
+      console.error('人脸验证出错:', error);
+      ElMessage({
+        message: '人脸验证失败，请重试',
+        type: 'error',
+        duration: 3000
+      });
+      resolve(false);
+    }
+  });
 };
 
 const getTemplateIdsFromUrl = (response, url, index)=> {