如何在 AWS Amplify 的托管环境中加载 face-api.js 分片模型?

How to load face-api.js shard models in a hosted environment on AWS Amplify?

我正在尝试使用 face-api.js 库对实时网络摄像头进行一些情绪检测。它在本地环境中完美运行,但是当我尝试在 AWS Amplify 上托管它时,它给我一个错误,例如

Uncaught (in promise) Error: Based on the provided shape, [1,1,16,32], the tensor should have 512 values but has 231

这是尝试加载模型的代码:

    useEffect(() => {
        if(checked){
            const MODEL_URL = './models';
            const initModels = async () => {
                await face.nets.tinyFaceDetector.loadFromUri(MODEL_URL);
                await face.nets.faceLandmark68Net.loadFromUri(MODEL_URL);
                await face.nets.faceRecognitionNet.loadFromUri(MODEL_URL);
                await face.nets.faceExpressionNet.loadFromUri(MODEL_URL);
                enableWebcam();
            }
            initModels();
        }
    }, [checked]);

这是在 ./public 文件夹中找到的模型:

我发现人们遇到了类似的问题 here,我尝试通过尝试将所有分片文件更改为 .shard 或 [=27= .bin 文件扩展名并相应地更改了 manifest.json 但它仍然给我同样的错误。

我整天都在尝试对此进行调试,但似乎找不到解决方案。任何帮助我指出正确方向的帮助将不胜感激。 这是我第一次使用 React 和 AWS 在 Web 应用程序环境中使用 ML 模型。

好的,经过几个小时的调试,解决方案相当简单。我只需要以不同的方式加载模型,如下所示:

    useEffect(() => {
        if (checked) {
            const MODEL_URL = `/models`
            const initModels = async () => {
                Promise.all([
                    face.loadTinyFaceDetectorModel(MODEL_URL),
                    face.loadFaceLandmarkModel(MODEL_URL),
                    face.loadFaceRecognitionModel(MODEL_URL),
                    face.loadFaceExpressionModel(MODEL_URL)
                ]).then(enableWebcam);
            }
            initModels();
        }
    }, [checked]);