version

• Node version: 20.11.1

getting started

0. clone mooc-ai-face về, đặt ngang hàng với project của bạn.

cd mooc-ai-face --> npm run typescript and npm install

1. cd to your project and install package mooc-ai-face

npm install ../mooc-ai-face

2. copy model_tfjs from src/model_tfjs to public folder of project

3. disable fs, path, crypto for browsers usage

• https://www.npmjs.com/package/@techstark/opencv-js#webpack-configuration-for-browser-usage

3.1. For react js projects, there is no webpack.config.js available at root folder. So, use react-app-rewired instead.

• Install react-app-rewired.
• Create a file named config-overrides.js in the ROOT of your client/React project. NOT SRC the ROOT. Add the following code, which ignores fs if it's not found in any of the dependencies you are using.

module.exports = function override(config, env) {
    console.log("React app rewired works!")
    config.resolve.fallback = {
        fs: false,
        path: false,
        crypto: false
    };
    return config;
};

• Replace react-scripts in the scripts section of package.json with react-app-rewired. Example: // Other stuff above such as dependencies section "scripts": { "start": "react-app-rewired start", "build": "react-app-rewired build", "test": "react-app-rewired test", }, // Other stuff below such as eslintConfig or browserslist section
• Run it and enjoy!

4. usage

4.1. khởi tạo

• import * as faceTool from "mooc-ai-face"

• B1: khởi tạo và load model, gọi hàm faceTool.initial(videoElm) trong đó videoElm là HTMLVideoElement của webcam

• B2: executeLoop: gọi hàm output = faceTool.execute() để lấy output predict từ video

output

output có dạng

{code: number, message: string, embeded: number[512 ptu]}

code output list

• 0: thành công
• 1: tay che
• 2: khẩu trang
• 3: kính râm
• 4: vật che phủ
• 10: lỗi đầu vào không hợp lệ
• 11: Không tìm thấy khuôn mặt