时间戳

首页 > 解决方案 > Flutter Google Maps 应用程序在浏览器中引发异常和崩溃，但在 Android 上却没有

google-maps - Flutter Google Maps 应用程序在浏览器中引发异常和崩溃，但在 Android 上却没有

问题描述

我正在使用这个流行的 YouTube 教程附带的代码。它是一个大系列的一部分，有很多视图，所以我希望它是好的代码。此外，它在 Android 上运行良好。

我按照官方使用 Flutter 构建 Web 应用程序，但是，当我在浏览器中启动我的应用程序时，它崩溃了。

这是崩溃前的痕迹：

dart.developer.registerExtension ext.flutter.inspector.getChildren developer_patch.dart:65:72 dart.developer.registerExtension ext.flutter.inspector.getChildrenSummaryTree developer_patch.dart:65:72 dart.developer.registerExtension ext.flutter.inspector.getChildrenDetailsS​​ubtree developer_patch.dart:65:72 dart.developer.registerExtension ext.flutter.inspector.getRootWidget developer_patch.dart:65:72 dart.developer.registerExtension ext.flutter.inspector.getRootRenderObject developer_patch.dart:65:72 dart.developer.registerExtension ext.flutter.inspector.getRootWidgetSummaryTree developer_patch.dart:65:72 dart.developer.registerExtension ext.flutter.inspector.getDetailsS​​ubtree developer_patch.dart:65:72 dart.developer.registerExtension ext.flutter.inspector.getSelectedRenderObject developer_patch.dart:65 :72 飞镖。developer.registerExtension ext.flutter.inspector.getSelectedWidget developer_patch.dart:65:72 dart.developer.registerExtension ext.flutter.inspector.getSelectedSummaryWidget developer_patch.dart:65:72 dart.developer.registerExtension ext.flutter.inspector.isWidgetCreationTracked developer_patch。 dart:65:72 dart.developer.registerExtension ext.flutter.inspector.screenshot developer_patch.dart:65:72 dart.developer.postEvent Flutter.FrameworkInitialization {} developer_patch.dart:98:16flutter.inspector.screenshot developer_patch.dart:65:72 dart.developer.postEvent Flutter.FrameworkInitialization {} developer_patch.dart:98:16flutter.inspector.screenshot developer_patch.dart:65:72 dart.developer.postEvent Flutter.FrameworkInitialization {} developer_patch.dart:98:16

它在调用super()以下代码时崩溃（dart_sdk.js，第 6327 行）

  dart.DartError = class DartError extends Error {
    constructor(error) {
      super();
      if (error == null) error = new core.NullThrownError.new();
      this[dart._thrownValue] = error;
      if (error != null && typeof error == "object" && error[dart._jsError] == null) {
        error[dart._jsError] = this;
      }
    }
    get message() {
      return dart.toString(this[dart._thrownValue]);
    }
  };

这是调用堆栈

console.trace() 调试器评估代码：1:9
调试器评估代码：1
DartError dart_sdk.js:6327
throw_errors.dart:216
decodeEnvelope message_codecs.dart:569
_invokeMethod platform_channel.dart:156
onValue async_patch.dart:47
runUnary zone。 dart:1439
handleValue future_impl.dart:141
handleValueCallback future_impl.dart:686
_propagateToListeners future_impl.dart:715
_completeWithValue future_impl.dart:526
future_impl.dart:560
_microtaskLoop schedule_microtask.dart:43
_startMicrotaskLoop schedule_microtask.dart:52
_scheduleImmediate168dart:

问题：对此我能做些什么吗？我没有看到对“我的”代码的任何引用（因为它是异步的），也没有任何方法可以找到它是否是“我的代码”中的问题。它在Android上运行得很好。

[更新]我也尝试了最简单的静态地图，尽管只有一个标记，并得到了相同的结果。

我是否必须接受 Flutter for web 处于 Beta 频道，并等待几个月看看它是否稳定？或者，有人有基于浏览器的 Flutter Google Maps 演示吗？

标签： google-mapsflutterbrowser

解决方案

官方 Flutter 谷歌地图插件目前不支持网络，它仍在开发者预览中

使用此插件可与网络上的谷歌地图一起使用。

https://pub.dev/packages/flutter_google_maps

不要忘记在正文中的 index.html 中添加由插件自述文件提供的脚本标签。添加它们，一切正常。

希望这会帮助你。

推荐阅读