When using the Scandit Web SDK, encountering a black screen instead of a live camera feed can be caused by numerous reasons. This FAQ covers the most common reasons for this issue and how to resolve it.
Q: Why is the camera screen black when I load the Scandit Web SDK?
A black camera screen typically indicates that the browser was unable to access or render the camera feed. Here are the most common causes and solutions:
1. Browser Permissions Denied
Cause: The browser does not have permission to access the camera.
Solution:
-
Ensure the browser prompts you for camera access.
- Make sure our API is used properly. See here fore more details: WebSDK - How to Manage the Camera?
- Make sure all needed requests and permissions are set in your app in case you're running your website from within a WebView or similar.
-
Check your browser's permission settings and manually allow camera access for your site.
-
Refresh the page after changing permissions.
2. Insecure Connection (HTTP vs HTTPS)
Cause: Browsers restrict camera access on insecure (HTTP) websites. You can find more details here: Do I really need to serve my site with https?
Solution:
-
Make sure your website is served over HTTPS or from other secure origin.
3. Camera In Use by Another Application
Cause: The device's camera is already in use by another browser tab or application.
Solution:
-
Close any other apps or tabs that might be using the camera.
-
Restart the browser or device if necessary and try again.
4. Device or Browser Compatibility Issues
Cause: The device or browser may not fully support the Web SDK or camera API.
Solution:
-
Use a supported browser. A complete list is available here: WebSDK - system requirements
5. Incorrect Scandit API usage
Cause: Improper initialization of the Scandit Camera API.
Solution:
- Make sure that the Camera API is used properly. See here for more details: WebSDK - How to Manage the Camera?
- You can also find some framework-specific guidelines here: How to hook the Camera into Navigation and Framework Lifecycle?
-
Check for JavaScript errors in the browser console.
6. Permissions or Settings on Mobile Browsers
Cause: Mobile browsers may behave differently with permissions or screen rendering.
Solution:
- Make sure camera permissions are granted at the OS level too.
7. Camera Not Detected or Hardware Issue
Cause: The device may not have a functional camera or the browser can't detect it.
Solution:
- For desktop devices: Try to use an external camera.
- Test the camera using our live WebSDK demo at websdk.scandit.com.
-
Test the camera using the WebRTC test site at https://webrtc.github.io/samples/src/content/getusermedia/gum/.
- Check available cameras using this demo: https://webrtc.github.io/samples/src/content/devices/input-output/.
-
Try a different device to see if this is a device-specific issue.
Still Seeing a Black Screen?
If none of the above helps:
-
Check the browser console for error messages.
-
Update your Scandit Web SDK to the latest version.
In case your issue persists, please contact us directly by submitting a support request.
https://support.scandit.com/hc/en-us/requests/new
Ideally, please also provide all the related information to speed up the investigation process on our end:
-
-
Browser and version used.
-
Device type and OS version.
-
SDK version used.
-
Code snippet for your scanner component.
-
Any console logs or errors.
- A short recording showcasing the issue.
-