Flutter移动端Stripe支付链接不显示GPay的问题咨询

针对你遇到的原生浏览器能显示GPay但InAppWebView中无法显示的问题，可尝试以下调整：

• 修正User-Agent配置
  当前使用的是桌面端UA，Stripe支付页面会根据UA判断设备类型，桌面端UA不会触发移动支付选项。建议替换为对应移动端的UA：

  • Android设备UA示例："Mozilla/5.0 (Linux; Android 10; SM-G973F) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/91.0.4472.120 Mobile Safari/537.36"
  • iOS设备UA示例："Mozilla/5.0 (iPhone; CPU iPhone OS 15_0 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/15.0 Mobile/15E148 Safari/604.1"
    也可以通过await WebViewEnvironment.getWebViewUserAgent()获取系统默认移动端UA，避免硬编码适配问题。

• 启用WebView核心功能
  Stripe支付页面依赖JavaScript、DOM存储及第三方Cookie，需在InAppWebViewOptions中明确开启：

  crossPlatform: InAppWebViewOptions(
    // ...原有配置
    javascriptEnabled: true,
    domStorageEnabled: true,
    thirdPartyCookiesEnabled: true,
    allowFileAccess: true,
    allowUniversalAccessFromFileURLs: true,
  )
  

• Android平台额外配置
  在AndroidManifest.xml中添加必要权限：

  <uses-permission android:name="android.permission.INTERNET" />
  <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
  

  同时在Android专属配置中启用混合渲染及内容访问权限：

  android: AndroidInAppWebViewOptions(
    useHybridComposition: true,
    allowContentAccess: true,
  )
  

• 清理WebView插件依赖
  你同时引入了多个WebView相关插件（webview_flutter_wkwebview、flutter_inappwebview、webview_flutter_plus），可能导致依赖冲突或行为异常。建议仅保留flutter_inappwebview一个插件，移除其余两个后重新构建项目。

• 验证Stripe后端配置
  确认后端生成的支付Intent已正确启用GPay：

  • 确保allowed_payment_methods包含card及GPay对应的支付方式代码
  • 支付货币、地区需符合GPay支持范围（如美元、欧元等，地区需为GPay服务覆盖国家）
  • 支付链接需为HTTPS协议（Stripe要求）

修改后的代码示例 #

InAppWebView(
  initialUrlRequest: URLRequest(url: Uri.parse(paymentlink)),
  initialOptions: InAppWebViewGroupOptions(
    crossPlatform: InAppWebViewOptions(
      mediaPlaybackRequiresUserGesture: false,
      userAgent: "Mozilla/5.0 (Linux; Android 10; SM-G973F) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/91.0.4472.120 Mobile Safari/537.36",
      javascriptEnabled: true,
      domStorageEnabled: true,
      thirdPartyCookiesEnabled: true,
      allowFileAccess: true,
      allowUniversalAccessFromFileURLs: true,
    ),
    android: AndroidInAppWebViewOptions(
      useHybridComposition: true,
      allowContentAccess: true,
    ),
    ios: IOSInAppWebViewOptions(
      allowsInlineMediaPlayback: true,
    ),
  ),
  onWebViewCreated: (InAppWebViewController controller) {
    _controller = controller;
  },
  androidOnPermissionRequest: (InAppWebViewController controller,
      String origin, List<String> resources) async {
    return PermissionRequestResponse(
      resources: resources,
      action: PermissionRequestResponseAction.GRANT,
    );
  },
)

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