webcamjs icon indicating copy to clipboard operation
webcamjs copied to clipboard

Plain Green image returned on some android devices

Open glayn2bukman opened this issue 2 years ago • 0 comments

Some android devices (Infinix phones in particular) only get a plain green/black image returned as base64Data in Webcam.snap. The issue as it turns out was caused by canvas.toDataURL. The way around it was first use canvas.toBlob, then use a FileReader to read the blob as readAsDataURL (ie base64). In brief, in snap, I replaced

user_callback(
    user_canvas ? null : canvas.toDataURL('image/' + params.image_format, params.jpeg_quality / 100 ),
    canvas,
    context
);

with

if(!user_canvas){
    canvas.toBlob(function(data){
        var reader = new FileReader();
        reader.readAsDataURL(data); 
        reader.onloadend = function() {
          user_callback(reader.result,canvas,context);
        }
    }, 'image/' + params.image_format, params.jpeg_quality / 100);
}else{
   user_callback(null,canvas,context);
}

This issue has forced me to revisit every userMedia code i every wrote and update it to drop canvas.toDataURL

glayn2bukman avatar Jun 20 '22 15:06 glayn2bukman