Flutter应用WebView渲染网站时模拟器长时间卡顿求助

已执行的排查操作 #

• 删除并重新创建模拟器
• 检查网络连接
• 使用Postman验证网站端点可访问性
• 排查控制台的CORS策略错误
• 清除缓存并重启应用/模拟器
• 调试确认WebView无法正常工作，持续加载URL并显示占位符

额外排查与解决步骤 #

1. 检查WebView插件及平台配置 #

确认webview_flutter等插件版本适配当前Flutter SDK，在pubspec.yaml中核对依赖后执行flutter pub get更新。同时配置平台权限：

• Android端：在android/app/src/main/AndroidManifest.xml中添加网络权限：

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

  若加载HTTP站点，需在application标签内添加：

  android:usesCleartextTraffic="true"
  

• iOS端：在ios/Runner/Info.plist中添加HTTP访问例外（若需加载非HTTPS站点）：

  <key>NSAppTransportSecurity</key>
  <dict>
      <key>NSAllowsArbitraryLoads</key>
      <true/>
  </dict>
  

2. 校验WebView初始化代码 #

确保URL格式正确（必须带http://或https://），添加回调捕获加载错误：

WebView(
  initialUrl: "https://example.com",
  javascriptMode: JavascriptMode.unrestricted,
  onPageStarted: (url) => print("开始加载: $url"),
  onPageFinished: (url) => print("加载完成: $url"),
  onWebResourceError: (error) => print("加载错误: ${error.description}"),
)

通过onWebResourceError能直接获取具体错误原因，比控制台日志更精准。

3. 调整模拟器网络设置 #

部分模拟器存在DNS解析异常，可将网络切换为桥接模式，或手动指定DNS服务器（如8.8.8.8）。Android模拟器中，10.0.2.2对应本地主机，若加载本地服务需确认地址无误。

4. 测试真机运行 #

把应用部署到真实设备上验证，排除模拟器环境问题。如果真机正常加载，说明问题出在模拟器配置；若真机也无法加载，需进一步排查插件兼容性或网站限制。

5. 自定义User-Agent #

部分网站会限制非浏览器请求，给WebView设置浏览器级别的User-Agent：

WebView(
  initialUrl: "https://example.com",
  javascriptMode: JavascriptMode.unrestricted,
  userAgent: "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/114.0.0.0 Safari/537.36",
)

6. 清空WebView缓存与Cookie #

强制清除缓存和Cookie，避免旧数据干扰加载：

WebView(
  initialUrl: "https://example.com",
  javascriptMode: JavascriptMode.unrestricted,
  onWebViewCreated: (controller) {
    controller.clearCache();
    controller.clearCookies();
  },
)

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