Why is Blazor Hybrid's file input crashing on iOS?!

On Android and WinUI input tag with type of file is working fine when trying to capture image/video with the camera, but on iOS doing weird stuff like crashing on a real device or showing a black screen when you want to upload an image or video from the camera! so no worries we're here to fix them all.

Crashing on opening camera

Why it's happening only on the Hybrid app?
Because unlike PWA or SPA, it's basically an actual app accessing all the native stuff + Web UI and the crashing is because you need to give it the right permissions just like a native app!
So go to YOURPROJECTNAME\Platforms\iOS\Info.plist and add these lines:

<key>NSCameraUsageDescription</key>
<string>This app uses camera for...</string>
<key>NSMicrophoneUsageDescription</key>
<string>This app uses microphone to record videos for...</string>

Camera view is black!

I don't know if this is on BlazorWebView or not but when you open the camera from an input tag it shows a black screen! so I read WKWebView's docs and found the AllowsInlineMediaPlayback property and we have to enable it in our BlazorWebView!
In your MainPage.xaml.cs add these lines:

BlazorWebViewHandler.BlazorWebViewMapper.AppendToMapping("CustomBlazorWebViewMapper", (handler, view) =>
{
#if IOS
    var configs = handler.PlatformView.Configuration;
    configs.AllowsInlineMediaPlayback = true;
#endif
});

---

So that was all you needed to fix the input tag on a Blazor Hybrid iOS app!
Luckily we've covered these in BitPlatform templates and more!

Happy coding ;D

Comments

[Saleh Yusefnejad]

wow, great findings and nice article 👏
good job MARD 👌

[Mohammad Hossein Rastegarinia]

Thanks dear Saleh 😎❤️