Hi guys, I am making an app prototype and I am trying to allow users to access their camera (using the ‘start’ button on the screenshot below) and start filming directly from Webflow.
Ideally I need the user to be able to then upload the video they just filmed on the page so that they can view it and create their own gallery/collection of videos.
How could this be made possible? So far I have managed to connect the camera using this custom code ```
But haven't been able to upload and allow the user to create a collection of videos using this app prototype.
Does anyone know how I could do this?
Here is my public share link: https://preview.webflow.com/preview/fitfam-2d2d36?utm_medium=preview_link&utm_source=dashboard&utm_content=fitfam-2d2d36&preview=f99e7e423d03291c6f97cc68e8412ab5&mode=preview
Published link (made for phone view): https://preview.webflow.com/preview/fitfam-2d2d36?utm_medium=preview_link&utm_source=dashboard&utm_content=fitfam-2d2d36&preview=f99e7e423d03291c6f97cc68e8412ab5&mode=preview
Oof, there’s going to be someone who has put more research into this than me; but I want to get the discussion started since I would like to know as well.
I have built this in the past, using only html5, js and node. From what Ive learned is that it is fairly easy to have camera live image on your html5 canvas but capturing it and storing that file remotely is not browser native. What we ended up doing was sending the video data as blob to a node backend that then managed the blob as files and passed then to the accounts video storage service.
I have solved this issue by using a third party tool and by integrating it with Webflow. I have written a tutorial which is published here in the forum.