网页中的 Flutter Firebase 实时数据库

Cor*_*ole 15 firebase firebase-realtime-database flutter flutter-web

我正在尝试让我的 Flutter 应用程序在浏览器中运行,这取决于 firebase_database。没有任何关于如何做到这一点的文档,但我根据 firebase_core 和 firebase_auth 文档做出了一些假设:

我的应用程序在 iOS 和 android 上运行,但我无法让数据库在 flutter web 中运行。

我已经设置了我的 index.html:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Flutter WebRTC Demo</title>
</head>
<body>
    <script src="https://www.gstatic.com/firebasejs/7.6.1/firebase-app.js"></script>
    <script src="https://www.gstatic.com/firebasejs/7.6.1/firebase-database.js"></script>
    <script>
        const firebaseConfig = {
            apiKey: '...',
            authDomain: '...',
            databaseURL: '...',
            projectId: '...',
            storageBucket: '...',
            messagingSenderId: '...',
            appId: '...'
        };
        firebase.initializeApp(firebaseConfig);
    </script>
    <script src="main.dart.js" type="application/javascript"></script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

但是,当我尝试使用 firebase 数据库时,日志中出现错误:

MissingPluginException(No implementation found for method DatabaseReference#set on channel plugins.flutter.io/firebase_database)
package:dart-sdk/lib/_internal/js_dev_runtime/private/ddc_runtime/errors.dart 196:49  throw_
package:flutter/src/services/platform_channel.dart 319:7                              invokeMethod
package:dart-sdk/lib/_internal/js_dev_runtime/patch/async_patch.dart 47:50            onValue
package:dart-sdk/lib/async/zone.dart 1381:54                                          runUnary
package:dart-sdk/lib/async/future_impl.dart 139:18                                    handleValue
package:dart-sdk/lib/async/future_impl.dart 680:44                                    handleValueCallback
package:dart-sdk/lib/async/future_impl.dart 709:32                                    _propagateToListeners
package:dart-sdk/lib/async/future_impl.dart 524:5                                     [_completeWithValue]
package:dart-sdk/lib/async/future_impl.dart 554:7                                     callback
package:dart-sdk/lib/async/schedule_microtask.dart 43:11                              _microtaskLoop
package:dart-sdk/lib/async/schedule_microtask.dart 52:5                               _startMicrotaskLoop
package:dart-sdk/lib/_internal/js_dev_runtime/patch/async_patch.dart 168:15           <fn>
Run Code Online (Sandbox Code Playgroud)

有什么方法可以让实时数据库在网络上的 Flutter 应用程序中工作?

Cor*_*ole 14

flutterfire github 的主自述文件中,有一个“Web?” 请注意哪些插件已准备好用于 Web 的列。

目前,只有firebase_corefirebase_authcloud_firestore,和firebase_functions在扑web应用程序的支持。

正如@Frank van Puffelen 提到的,要在 flutter web 中使用 firebase 的全部功能,请使用firebase-dart包装器库。

还有一个Flutter Web Plugins Project Board,它显示了路线图上的Flutter 插件,以及它们处于哪个开发阶段。在此编辑时,firebase_storage是网络路线图上的下一个插件。


Fra*_*len 6

FlutterFire 插件最初是为在 iOS 和 Android 的原生移动应用程序中工作而构建的。正如我们所说,对 Web 平台的支持正在添加到插件中,但要覆盖所有 Firebase 产品还需要一些时间。

您可以在 Github 存储库上的可用 FlutterFire 插件列表中检查当前哪些模块与 Flutter for web 兼容。

要在 Flutter 网页版中使用 Firebase 的其他功能,请使用firebase-dart插件。这意味着您需要为 Web 和移动设备编写单独的代码,但您或许可以在应用程序的一小部分中隔离差异。


Fri*_*ick 5

我也遇到了同样的问题,并决定对此做点什么。所以我继续制作https://pub.dev/packages/firebase_db_web_unofficial。它很容易设置并集成到您的代码中。