Published camera kit projects?

[glacial bluff]

Are there any websites that showcase a camera kit integration with a working record + share button that I could show a client ? 🙏 Hard to sell it without an example 😄

[tulip roost]

You can do it with your own lens using this:
https://camerakit-deployer.gowaaa.com

Or use this lens provided by Snap:
https://camerakit-web-w-recordfeature-gw.vercel.app

[glacial bluff]

Danny just sent me this last night, incredible work thank you @tulip roost ! 🙂
Can you explain (for dummies) what you mean by "For real business/client projects, please use a more secure version with proper backend implementation."?
I am not a webdev expert and usually just deploy everything i build for myself on Netlify, had no clients for web so far so i don't know much about security stuff 🫠

[tulip roost]

The camera kit token can be accessed by anyone for the template I provided.
This means that anyone can clone your website that will show the same lens, and add an additional malicious layer such as getting credit card info if they want it.

[glacial bluff]

got it, thanks!

[tulip roost]

I missed this out but in the github repo I also have instructions on how to deploy by yourself on vercel and not expose the sensitive tokens
https://github.com/GOWAAA/camerakit-web-w-recordfeature

[idle helm]

Remember to read all the README section from Boon's project before deploying a project based on it.

[tulip roost]

@glacial bluff I realise my previous code made it a bit too complicated to deploy on vercel without exposing the tokens, I have updated it with instructions for easier secured deployment on vercel using vercel environment variables.
Hope it helps to make everyone's life easier.

[glacial bluff]

Awesome! Thank you so much for offering this to the community, super valuable 🙏☺️ hope I can apply it soon

[idle helm]

@glacial bluff Disclaimer: We are only dealing with an issue that sounds from the experience don’t tranlate into recordings.

[tranquil bough]

Yep we did a similar template from
scratch and for sounds you can get the mic by asking the user at the beginning and you have to combine the audio from usermedia with the video from the canvas to then export the blob

Edit : this is for user mic, actually for the sounds coming from the lens I have no idea.. maybe not using a canvas at all and make everything in a video element would help ?

[idle helm]

It seems Denis aka Enuriru seem to have found some solution thats why I’am asking if that is even possible but he sadly didn’t reveal his secret

[tulip roost]

Sadly it's not possible to not use a canvas at all as Camera Kit output the lens feed with a canvas (technically it's 2 canvases, one live and one capture). It actually doesn't matter even if we don't create a canvas ourselves because of this.

[tranquil bough]

const stream = canvas.captureStream();
const audioTracks = stream.getAudioTracks();
Then continue with MediaRecorder

Found this, I will test later

[tulip roost]

I just tried and I believe stream.getAudioTracks() returns undefined

[idle helm]

There is no audio if you are capturing the stream from canvas. The documentation even has a paragraph about the no internal audio part. Only mic input can be merged into the final recording.

[tranquil bough]

@hx very clear thank you, I was confuse because someone told me he could hear the lens audio in Camera kit web