Face Recognition on Webcam Implementation: Cannot read property 'descriptor' of undefined

Urgent: Facing this issue in the implementation of face recognition on the webcam camera for the browser. This error only comes when I add more than 1 name in my labels in loadLabeledImages() function. If I have one name, it works perfectly fine. Any help is appreciated. This is a part of a project that has to be completed in a week! Thank you so much!

Getting “Uncaught (in promise) TypeError: Cannot read property ‘descriptor’ of undefined”

This is the code for your reference:

`

 const video = document.getElementById('video')
 
 Promise.all([
   faceapi.nets.tinyFaceDetector.loadFromUri('/models'),
   faceapi.nets.faceLandmark68Net.loadFromUri('/models'),
   faceapi.nets.faceRecognitionNet.loadFromUri('/models'),
   faceapi.nets.ssdMobilenetv1.loadFromUri('/models'),
 ]).then(startVideo)

function startVideo() {
  navigator.getUserMedia(
    { video: {} },
    stream => video.srcObject = stream,
    err => console.error(err)
  )
}

this.video.addEventListener('play',() => {
  const canvas = faceapi.createCanvasFromMedia(video)
  document.body.append(canvas)
  const displaySize = { width: video.width, height: video.height }
  faceapi.matchDimensions(canvas, displaySize)
  setInterval(async () => {
    const detections = await faceapi.detectAllFaces(video).withFaceLandmarks().withFaceDescriptors()
    const resizedDetections = faceapi.resizeResults(detections, displaySize)
    canvas.getContext('2d').clearRect(0, 0, canvas.width, canvas.height)
    faceapi.draw.drawFaceLandmarks(canvas, resizedDetections)
    this.labeledFaceDescriptors = await this.loadLabeledImages()
    const faceMatcher = new faceapi.FaceMatcher(labeledFaceDescriptors, 0.6)
    const results = resizedDetections.map(d => faceMatcher.findBestMatch(d.descriptor))
    results.forEach((result, i) => {
      const box = resizedDetections[i].detection.box
      const drawBox = new faceapi.draw.DrawBox(box, {label: result.toString()})
      drawBox.draw(canvas) 
    })

  }, 100) 
})

function loadLabeledImages() {

  try{
    const labels = ['Shriya', 'judhi']

    return Promise.all(
      labels.map(async label => {
        const descriptions = []
        for (let i = 1; i <= 3; i++) {
          const img = await faceapi.fetchImage(`public/img/${label}/${i}.jpg`)
          const detections = await faceapi.detectSingleFace(img).withFaceLandmarks().withFaceDescriptor()
          descriptions.push(detections.descriptor)
        }
  
        return new faceapi.LabeledFaceDescriptors(label, this.descriptions)
      })
    )

  }
  catch(err){
    console.log(err)
  }

}`

[chenchiuchi]

It is because your label image doesn’t detect any face. You need to ensure the images are person face

[ThaiNhung]

But I am still facing the same problem even after updating to 0.22. Do you have any other solution? … On Tue, Oct 18, 2022 at 9:40 AM ThaiNhung @.> wrote: Hi, as ThaiNhung - I have the same issue where there is an error in few devices that the face doesnt scan. So I updated the face-api.min.js to 0.22 version but now it shows as descriptor of undefined. This happens only for few devices because it works in my DELL computer but doesn’t work in HP computer. Do you have any suggestion regarding this? Hi HalirRamzi, sorry with respond later. With the same problem above, I try to replace another image with clearer, better lighting. I have to try it about 3 times then it works properly. — Reply to this email directly, view it on GitHub <#596 (comment)>, or unsubscribe https://github.com/notifications/unsubscribe-auth/AGCNPRCRLOSGRAAZLOFCFB3WDYPMHANCNFSM4MIYQ7NQ . You are receiving this because you commented.Message ID: @.>

Not yet. just have 1 solution above.