iOS WebKit View应用获取地理位置时出现双重授权提示问题

嘿，这个问题我太熟了——不少用WKWebView做内嵌网页的开发者都碰到过这两次弹窗的坑，用户体验确实糟透了。咱们来一步步搞定它：

为什么会出现两次弹窗？ #

这是因为两层权限机制在起作用：

1. 第一层是iOS系统层面的App位置权限，系统会询问用户是否允许你的App访问位置；
2. 第二层是WKWebView自身的权限机制，网页通过navigator.geolocation请求位置时，WebKit会单独发起一次权限询问。

要解决问题，核心思路就是让WebView复用App已经获得的系统位置权限，避免重复弹窗。

具体解决方案 #

步骤1：先配置系统权限描述（必做） #

首先确保你的Info.plist里添加了位置权限的描述，不然系统连第一层弹窗都不会出，还会被App Store拒绝上架。

右键点击Info.plist → 选择Add Row，添加以下任意一个（根据你的需求选）：

• NSLocationWhenInUseUsageDescription：填写用户能看懂的权限说明，比如"需要访问您的位置以提供精准服务"
• NSLocationAlwaysAndWhenInUseUsageDescription：如果需要后台访问位置就加这个

步骤2：iOS 15+ 极简解决方案（推荐） #

iOS 15之后苹果给WKWebView加了专门的API，直接让WebView复用App的系统权限，一行代码就能搞定：

import WebKit
import CoreLocation

class YourViewController: UIViewController, CLLocationManagerDelegate, WKUIDelegate {
    private let locationManager = CLLocationManager()
    private var webView: WKWebView!

    override func viewDidLoad() {
        super.viewDidLoad()
        // 先请求系统位置权限
        locationManager.delegate = self
        locationManager.requestWhenInUseAuthorization()
    }

    // 权限状态变化后初始化WebView
    func locationManagerDidChangeAuthorization(_ manager: CLLocationManager) {
        guard manager.authorizationStatus == .authorizedWhenInUse || manager.authorizationStatus == .authorizedAlways else {
            // 如果用户拒绝了权限，可以在这里提示用户去设置里开启
            return
        }
        
        // 初始化WKWebView，关键配置在这里
        let config = WKWebViewConfiguration()
        config.defaultWebpagePreferences.allowsContentJavaScript = true // 必须开启，不然网页JS用不了地理位置
        // 重点：让WebView使用App当前的位置权限，不再单独弹窗
        if #available(iOS 15.0, *) {
            config.geolocationAuthorizationPolicy = .currentUserPermission
        }

        webView = WKWebView(frame: view.bounds, configuration: config)
        webView.uiDelegate = self
        view.addSubview(webView)

        // 加载你的网页
        if let url = URL(string: "https://mywebsite.com") {
            webView.load(URLRequest(url: url))
        }
    }
}

步骤3：iOS 15以下兼容方案 #

如果需要支持iOS 15之前的版本，我们可以通过注入JS接管网页的地理位置请求，用原生CoreLocation获取位置后再传递给网页，彻底绕过WebView的权限弹窗：

在上面的代码基础上，添加以下扩展：

// 注入JS和处理JS消息的扩展
extension YourViewController: WKScriptMessageHandler {
    func setupWebViewForOlderiOS() {
        let config = WKWebViewConfiguration()
        config.defaultWebpagePreferences.allowsContentJavaScript = true

        // 注入JS，替换网页的navigator.geolocation方法
        let jsScript = """
        // 替换原生的getCurrentPosition，转而向原生App请求位置
        navigator.geolocation.getCurrentPosition = function(successCallback, errorCallback) {
            window.webkit.messageHandlers.locationRequest.postMessage({action: 'getLocation'});
            // 保存回调函数，等原生返回结果后调用
            window.geolocationSuccess = successCallback;
            window.geolocationError = errorCallback;
        };
        """
        let userScript = WKUserScript(source: jsScript, injectionTime: .atDocumentStart, forMainFrameOnly: true)
        config.userContentController.addUserScript(userScript)
        // 添加消息处理器，接收JS的位置请求
        config.userContentController.add(self, name: "locationRequest")

        webView = WKWebView(frame: view.bounds, configuration: config)
        view.addSubview(webView)
    }

    // 接收JS发来的位置请求
    func userContentController(_ userContentController: WKUserContentController, didReceive message: WKScriptMessage) {
        if message.name == "locationRequest" {
            // 调用CoreLocation获取位置
            locationManager.requestLocation()
        }
    }

    // CoreLocation获取到位置后，传递给JS
    func locationManager(_ manager: CLLocationManager, didUpdateLocations locations: [CLLocation]) {
        guard let location = locations.first else { return }
        let locationData = [
            "coords": [
                "latitude": location.coordinate.latitude,
                "longitude": location.coordinate.longitude,
                "accuracy": location.horizontalAccuracy
            ]
        ]
        // 调用JS的成功回调
        webView?.evaluateJavaScript("window.geolocationSuccess(\(locationData))", completionHandler: nil)
    }

    // 获取位置失败时，传递错误给JS
    func locationManager(_ manager: CLLocationManager, didFailWithError error: Error) {
        webView?.evaluateJavaScript("window.geolocationError('\(error.localizedDescription)')", completionHandler: nil)
    }
}

然后在locationManagerDidChangeAuthorization方法里，针对iOS 15以下的情况调用setupWebViewForOlderiOS()即可。

注意事项 #

• 测试时记得重置App的权限：可以在iPhone的设置 → 通用 → VPN与设备管理 → 开发者 → 重置位置与隐私，这样能模拟第一次打开App的场景。
• 如果用户拒绝了位置权限，要做好友好提示，引导用户去设置里开启权限。
• 确保网页的navigator.geolocation代码能正确处理原生传递过来的位置数据，逻辑和原来的JS代码保持一致。

内容的提问来源于stack exchange，提问作者angelique000