Flutter中如何避免InAppWebView二次请求位置访问权限

两次弹窗的触发逻辑完全独立：

• 第一次弹窗是Flutter层通过权限插件申请的App级系统定位权限，样式可自定义、观感统一
• 第二次弹窗是WebView内核（iOS为WKWebView、安卓为系统定制WebView）检测到页面发起地理定位请求时，触发的内核自带权限校验弹窗，样式由系统WebView控制、无法自定义，在直接加载本地无服务的html文件时触发概率为100%

两类弹窗实际效果参考：

• 应用端统一样式的权限弹窗效果：
  
• WebView内核自带的粗糙权限弹窗效果：
  

核心思路是：提前在Flutter层完成系统定位权限申请，拦截WebView内核的权限请求回调直接返回授权结果，避免内核触发自带弹窗，同时用本地localhost服务替代file://协议加载本地html，消除安全上下文校验触发的强制弹窗。

前置依赖准备 #

推荐优先使用flutter_inappwebview作为WebView实现，官方webview_flutter在部分安卓厂商ROM上权限拦截存在兼容问题。同时搭配本地localhost服务插件（如in_app_localhost_server）托管本地html资源，禁止直接用file://路径加载本地页面。

基础原生配置 #

1. 页面初始化时，先通过permission_handler等权限插件申请定位权限，拿到用户授权结果后再启动本地服务、加载WebView页面，未拿到权限时直接拦截页面定位请求即可。
2. iOS端配置：打开ios/Runner/Info.plist文件，添加定位权限描述字段：

<key>NSLocationWhenInUseUsageDescription</key>
<string>App需要获取位置信息提供对应服务</string>
<key>NSLocationAlwaysAndWhenInUseUsageDescription</key>
<string>App需要获取位置信息提供对应服务</string>

3. 安卓端配置：打开android/app/src/main/AndroidManifest.xml，添加定位权限声明：

<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />

WebView侧拦截配置 #

使用flutter_inappwebview的场景 #

初始化WebView时实现地理权限请求回调，直接返回授权结果，拦截内核弹窗：

InAppWebView(
  // 用本地localhost服务地址加载，不要用file://路径
  initialUrlRequest: URLRequest(url: WebUri("http://localhost:8080/index.html")),
  onGeolocationPermissionsShowPrompt: (controller, requestOrigin) async {
    // 此时Flutter层已经拿到系统定位权限，直接返回允许，同时记住授权状态
    return GeolocationPermissionShowPromptResponse(
      origin: requestOrigin,
      allow: true,
      retain: true
    );
  },
)

使用官方webview_flutter（4.0+版本）的场景 #

初始化WebViewController时设置权限回调，拦截默认弹窗：

final controller = WebViewController()
  ..setGeolocationPermissionsPromptCallbacks(
    onShowPrompt: (request) async {
      return GeolocationPermissionsResponse(
        allow: true,
        retain: true,
      );
    },
  )
  ..loadRequest(Uri.parse("http://localhost:8080/index.html"));

注意：如果直接加载file://路径的本地html，即使配置了权限拦截，iOS部分系统版本、国内厂商定制安卓系统的WebView仍会强制弹出内核自带的简陋权限弹窗，必须通过本地localhost服务加载资源才能彻底规避该问题。

效果验证 #

配置完成后，仅会弹出Flutter层配置的统一样式权限申请弹窗，WebView侧不会二次弹出权限申请，页面内的定位接口可正常调用，无功能异常。

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