Hi everyone, I would like to have a preview of my webcam and put a button at the bottom “capture” with the workflow that goes with it. The problem is that I have not found an element to preview his webcam 
The QR code scanner element will allow you to access your webcam.
Perhaps you can work with it to achieve this. I think you’ll need a snippet of JavaScript to handle the “capture” action in your workflow.
Haven’t tried it but this article might be a good place to start once you’ve managed to preview your webcam with the QR code scanner.
Does that help?
1 Like
Hello ! Thank you for your response. it would be nice to have a native function on weweb to do what I’m describing, there are several use cases where this would be relevant.
By the way i asked the js ai generator to do the thing for me, here is the code :
// Access the global variable
let cameras = variables[‘33ffb9fe-b797-487a-a038-cd0cf7f00901-cameras’];
// Check if the camera is available
if (cameras && cameras.length > 0) {
// Get the first camera
let camera = cameras[0];
// Create a new canvas
let canvas = document.createElement('canvas');
// Set the canvas dimensions
canvas.width = camera.videoWidth;
canvas.height = camera.videoHeight;
// Get the 2D context from the canvas
let ctx = canvas.getContext('2d');
// Draw the current frame from the camera onto the canvas
ctx.drawImage(camera, 0, 0, canvas.width, canvas.height);
// Convert the canvas image to Data URL
let imageData = canvas.toDataURL('image/png');
// Return the image data
return imageData;
} else {
// If no camera is available, return null
return null;
}
and it seems like this work 
Good point! Just created a product ticket so the team can explore the idea. I think with the upcoming marketplace, it’s likely we’ll have more and more components like this. Maybe you’ll even want to share the one you built on there!
1 Like
Niiiice! I hadn’t even thought of it. Really cool solution! Thanks for sharing it