App crashes when opening camera from file input in WKWebView (iOS)

Hello everyone,

I have a SwiftUI app using WKWebView to load a website that includes a form with a file input (<input type="file">). The issue is:

📌 When a user taps “Browse” and selects “Take Photo” (camera option), the app crashes before the camera opens.

Setup Details: • App Uses SwiftUI with WKWebView • The crash occurs only when selecting “Take Photo”, but selecting an image from the library works fine.

📌 Full Code (WKWebView in SwiftUI)

import SwiftUI
import WebKit

struct WebViewRepresentable: UIViewRepresentable {
    var urlString: String

    func makeUIView(context: Context) -> WKWebView {
        let webView = WKWebView()
        webView.configuration.allowsInlineMediaPlayback = true
        webView.configuration.mediaTypesRequiringUserActionForPlayback = []
        loadURL(in: webView)
        return webView
    }

    func updateUIView(_ uiView: WKWebView, context: Context) {
        loadURL(in: uiView)
    }

    private func loadURL(in webView: WKWebView) {
        if let url = URL(string: urlString) {
            webView.load(URLRequest(url: url))
        }
    }
}

struct ContentView: View {
    @State private var currentURL: String = "https://fv-wohlensee.ch"

    var body: some View {
        VStack(spacing: 0) {
            // Oberer Bereich in Grün
            Color(red: 0, green: 0.4, blue: 0)
                .frame(height: 50)

            // WebView with white background
            WebViewRepresentable(urlString: currentURL)
                .background(Color.white)

            Divider()

            // Navigation buttons
            HStack(spacing: 10) {
                Button {
                    currentURL = "https://fv-wohlensee.ch/vereinshaus-eymatt/"
                } label: {
                    VStack {
                        Image(systemName: "house")
                            .font(.system(size: 18))
                        Text("Klubhaus")
                            .font(.system(size: 12))
                            .minimumScaleFactor(0.7)
                            .lineLimit(1)
                    }
                    .padding(8)
                }
                .foregroundColor(.white)
                .frame(maxWidth: .infinity)

                Button {
                    currentURL = "https://fv-wohlensee.ch/vereinsboot/"
                } label: {
                    VStack {
                        Image(systemName: "ferry.fill")
                            .font(.system(size: 18))
                        Text("Boot")
                            .font(.system(size: 12))
                            .minimumScaleFactor(0.7)
                            .lineLimit(1)
                    }
                    .padding(8)
                }
                .foregroundColor(.white)
                .frame(maxWidth: .infinity)

                Button {
                    currentURL = "https://fv-wohlensee.ch/aktivitaeten/"
                } label: {
                    VStack {
                        Image(systemName: "calendar")
                            .font(.system(size: 18))
                        Text("Aktivitäten")
                            .font(.system(size: 12))
                            .minimumScaleFactor(0.7)
                            .lineLimit(1)
                    }
                    .padding(8)
                }
                .foregroundColor(.white)
                .frame(maxWidth: .infinity)

                Button {
                    currentURL = "https://fv-wohlensee.ch/mitglied-werden/"
                } label: {
                    VStack {
                        Image(systemName: "person.badge.plus")
                            .font(.system(size: 18))
                        Text("Mitglied")
                            .font(.system(size: 12))
                            .minimumScaleFactor(0.7)
                            .lineLimit(1)
                    }
                    .padding(8)
                }
                .foregroundColor(.white)
                .frame(maxWidth: .infinity)
            }
            .padding(.horizontal, 15)
            .padding(.vertical, 10)
            .background(Color(red: 0, green: 0.4, blue: 0))
        }
        .frame(maxWidth: .infinity, maxHeight: .infinity)
        .background(Color(red: 0, green: 0.4, blue: 0))
        .ignoresSafeArea()
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

What I’ve Tried:

1️⃣ Checked Info.plist: Added permissions for camera and photo library:

<key>NSCameraUsageDescription</key>
<string>This app requires access to the camera to upload photos.</string>
<key>NSPhotoLibraryUsageDescription</key>
<string>This app requires access to your photo library.</string>

2️⃣ Enabled Media Capture in WKWebView:

webView.configuration.allowsInlineMediaPlayback = true webView.configuration.mediaTypesRequiringUserActionForPlayback = []

3️⃣ Tested in Safari: The same form works fine when opened in Safari.

Questions:

❓ Does WKWebView need additional permissions to open the camera? ❓ Do I need to implement a delegate to handle file uploads in SwiftUI? ❓ Has anyone faced this issue and found a fix?

Any guidance would be greatly appreciated! 🚀

Thanks in advance! 😊