Hi everyone,
I'm encountering an issue where the camera doesn't open in a Reactive Web App that's embedded via an iframe inside a mobile native app.
Here’s what we’ve already done:
✅ The native app has camera permissions granted
✅ The iframe includes the proper attribute: allow="camera"
✅ We’ve added the HTTP response header to the reactive app: Permissions-Policy: camera=(self) (configured using the Factory Configurations plugin under Shared Config)
Despite this setup, the camera still gets blocked when the app is loaded inside the iframe.
If anyone has faced a similar issue or knows of a working workaround (especially on mobile platforms), I'd really appreciate your insights!
Thanks in advance
Hi Pedro,
it looks like you’ve already covered many of the common pitfalls. However, camera access from within an iframe in a mobile native app introduces additional complexity especially due to security restrictions in mobile WebViews (e.g., iOS WKWebView, Android WebView or Chrome Custom Tabs).
You might need to explicitly name the embedding origin if it's different (i.e., the mobile app uses file:// or capacitor://, or a custom scheme). Try:
Permissions-Policy: camera=*
In the iframe attribute make sure it is
<iframe allow="camera; microphone" src="..." ...>
If the only reason you're using an iframe is to load the reactive web app, try loading it directly in the WebView instead of embedding it via an iframe. Because, Most mobile platforms treat iframes as second-class citizens when it comes to privacy and security, especially for camera/microphone access.