The Camera component lets users take snapshots directly from their device camera. Calling requestCamera() prompts the browser for camera permission — this requires a secure context (HTTPS or localhost). Once permission is granted, call snapshot() to capture the current frame; the result is delivered to the server via the onSnapshotUpload event as media. Note that uploads larger than maxsize (default 300 KB) are silently dropped — set maxsize="-1" for unlimited, or listen to onMaxsizeExceed.

🔉This demo uses the browser Camera API. Camera access is only activated after you grant permission, and captured images remain in your browser unless you explicitly upload them.

<zk>
	<vlayout>
		<camera id="camera" width="480px" previewRecord="true" audio="false" maxsize="-1"
		        onSnapshotUpload="snapshotImage.setContent(event.getMedia())"/>
		<hlayout>
			<button label="Enable Camera" onClick="camera.requestCamera()"/>
			<button label="Snapshot" onClick="camera.snapshot()"/>
		</hlayout>
		<label value="Snapshot result:"/>
		<image id="snapshotImage" style="max-width: 480px;"/>
	</vlayout>
</zk>