Content Type: Module
Categories: Utility


To take Instant picture using webcam for web browsers.



This JavaScript action is supported on Mendix Runtime Versions above 9.12.0. It has been tested and verified to work on Mendix Runtime versions 9.12.0 and higher.


The WebCamForWebBrowsers_JS JavaScript action enables capturing images using the webcam in web browser applications developed with Mendix. It allows users to access their webcam, capture an image, and optionally proceed or retake the captured image.

Typical usage scenario

In a web application built with Mendix, you want to provide users with the ability to capture and set their profile picture using their device's webcam. Instead of uploading a picture from their device, users can take an instant photo using the webcam, preview it, and decide whether to keep it as their profile picture or retake it if they are not satisfied with the result.


Webcam Image Capture: The action enables users to capture images using their device's webcam directly within the Mendix web application.

Real-Time Preview: Users can see a real-time video stream from their webcam, allowing them to adjust their position and framing before capturing the image.

Capture and Retake: Users have the option to capture an image and preview it. If they are not satisfied with the result, they can choose to retake the picture.

Proceed and Save: After capturing the image and being satisfied with the preview, users can proceed to save the captured image as their profile picture or for other purposes.

Base64-Encoded Image: The action returns the captured image as a base64-encoded string, making it easy to store or use the image data within Mendix applications.


Browser Compatibility: The action relies on the navigator.mediaDevices.getUserMedia() API to access the user's webcam. It may not work on older browsers that do not support this API. Ensure to test on supported browsers.

HTTPS Requirement: The application must be served over HTTPS to access the user's webcam securely. Insecure HTTP environments may not allow webcam access.

User Permissions: The user needs to grant permission to the application to access their webcam. Users can choose to deny this permission, preventing image capture.

No Image Processing: The action captures raw images from the webcam and does not provide advanced image processing features like filters or editing.

Device Dependencies:

Dependencies [optional]

The action's functionality relies on the user having a device with a webcam. Users on devices without webcams will not be able to use this feature.

Configuration [optional]

To use the WebCamForWebBrowsers_JS JavaScript action in your Mendix application, follow these steps:

Drag and drop the "JavaScript Action" widget from the Toolbox into a Nanoflow in your Mendix application's microflow.

Configure the JavaScript action by setting its parameters and return type.

Call the Nanoflow from a button or other trigger in your Mendix application to initiate the webcam image capture.

Parameters The WebCamForWebBrowsers_JS JavaScript action does not require any input parameters.




Version: 1.0.0
Framework Version: 9.12.0
Release Notes: Initial Release