更新记录

1.0.1（2025-01-06） 下载此版本

1.支持自定义传入模型文件

1.0.0（2025-01-06） 下载此版本

新版发布

平台兼容性

Face API Plugin

基于face-api.js的uniapp人脸检测插件，提供人脸检测、表情识别、年龄性别识别等功能。

功能特点

• 人脸检测与定位
• 人脸特征点提取(68点)
• 表情识别(7种基本表情)
• 年龄与性别识别
• 人脸特征向量提取
• 人脸图片裁剪

安装

1. 通过插件市场安装
2. 通过npm安装:

   npm install face-api-plugin

使用方法

基础使用

import FaceApiPlugin from '@/uni_modules/face-api/index.js'

// 创建插件实例
const faceApi = new FaceApiPlugin()

// 初始化
await faceApi.init()

// 检测人脸
const results = await faceApi.detectFaces(image)

配置选项

const faceApi = new FaceApiPlugin({
  // 输入图片尺寸(必须是32的倍数)
  inputSize: 320,

  // 人脸检测置信度阈值(0~1)
  scoreThreshold: 0.3,

  // 人脸裁剪边距(像素)
  padding: 80,

  // 是否返回base64图片
  returnBase64: true,

  // 是否提取特征点
  landmarks: true,

  // 是否识别表情
  expressions: true,

  // 是否识别年龄性别
  ageGender: true,

  // 是否提取特征向量
  descriptor: true
})

配置模型路径

插件支持多种方式配置模型文件路径:

1. 使用CDN (默认)

   const faceApi = new FaceApiPlugin(options)
   // 或
   const faceApi = new FaceApiPlugin(options, 'https://your-cdn.com/weights')

2. 使用本地目录

   
   // 使用项目根目录下的static
   const faceApi = new FaceApiPlugin(options, '/static/face-api/weights')

// 使用插件目录下的static const faceApi = new FaceApiPlugin(options, '/uni_modules/face-api/static/weights')

### 本地模型文件目录结构

如果使用本地模型文件,需要将模型文件放在以下目录之一:

1. 项目根目录:

static/ face-api/ weights/ tiny_face_detector_model-weights_manifest.json face_landmark_68_model-weights_manifest.json face_expression_model-weights_manifest.json age_gender_model-weights_manifest.json face_recognition_model-weights_manifest.json

2. 插件目录:

uni_modules/ face-api/ static/ weights/ tiny_face_detector_model-weights_manifest.json face_landmark_68_model-weights_manifest.json face_expression_model-weights_manifest.json age_gender_model-weights_manifest.json face_recognition_model-weights_manifest.json

### API文档

#### FaceApiPlugin 类

##### 构造函数
```typescript
constructor(options?: FaceApiOptions)

方法

init

初始化插件,加载模型文件

init(): Promise<void>

detectFaces

检测图片中的人脸

detectFaces(image: HTMLImageElement): Promise<DetectionResult[]>

cropFace

裁剪人脸图片

cropFace(image: HTMLImageElement, detection: DetectionResult, padding?: number): Promise<string>

类型定义

FaceApiOptions

interface FaceApiOptions {
  inputSize?: number;
  scoreThreshold?: number;
  padding?: number;
  returnBase64?: boolean;
  landmarks?: boolean;
  expressions?: boolean;
  ageGender?: boolean;
  descriptor?: boolean;
}

DetectionResult

interface DetectionResult {
  detection: {
    score: number;
    box: {x: number, y: number, width: number, height: number};
  };
  landmarks?: {positions: Array<{x: number, y: number}>};
  expressions?: {[key: string]: number};
  age?: number;
  gender?: string;
  genderProbability?: number;
  descriptor?: Float32Array;
  faceImage?: string;
}

示例代码

完整示例请参考example目录

注意事项

1. 首次使用需要下载模型文件,建议:

   • 使用CDN加速
   • 预加载模型
   • 显示加载进度

2. 图片大小建议:

   • 宽高不超过640px
   • 人脸区域不小于100px

3. 性能优化:

   • 适当调整inputSize
   • 按需开启特征提取
   • 合理设置置信度阈值

更新日志

查看更新日志

License

MIT