- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
过去几周我一直在针对 Web 和 Android 测试 FirebaseAuth而且体验大多很糟糕。我已尝试添加尽可能多的信息,以便为您提供足够的背景信息。
我的目标
我的最终目标是制作一个包来简化 Flutter 中的 FirebaseAuth基本上,StreamBuilder 在来自 FirebaseAuth 的 authStateChanges 流上运行,它在登录后或当我重新加载整个页面(Flutter Web)时立即向用户提供信息,但在热重新加载期间不会返回用户,即使我知道用户已通过身份验证。当我重新加载网页时它再次起作用。Android 中不存在这种情况,并且它可以按预期工作。这非常令人沮丧,我需要任何人的帮助!
flutter 医生
Doctor summary (to see all details, run flutter doctor -v):
[√] Flutter (Channel stable, 2.0.2, on Microsoft Windows [Version 10.0.21296.1010], locale en-US)
[√] Android toolchain - develop for Android devices (Android SDK version 30.0.2)
[√] Chrome - develop for the web
[!] Visual Studio - develop for Windows (Visual Studio Community 2019 16.5.5)
X Visual Studio is missing necessary components. Please re-run the Visual Studio installer for the
"Desktop development with C++" workload, and include these components:
MSVC v142 - VS 2019 C++ x64/x86 build tools
- If there are multiple build tool versions available, install the latest
C++ CMake tools for Windows
Windows 10 SDK
[√] Android Studio (version 4.0)
[√] VS Code (version 1.56.2)
[√] Connected device (3 available)
Dart 版本控制
Dart VM version: 2.8.4 (stable) (Wed Jun 3 12:26:04 2020 +0200) on "windows_x64"
重现步骤
/web/index.html 中的 FirebaseSDK 版本控制
<script src="https://www.gstatic.com/firebasejs/8.6.2/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.6.2/firebase-analytics.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.6.2/firebase-auth.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.6.2/firebase-firestore.js"></script>
(the setup is correct as signIn works)
pubspec.yaml 依赖项
environment:
sdk: ">=2.7.0 <3.0.0"
dependencies:
flutter:
sdk: flutter
#Firebase Dependencies
firebase_core: ^1.2.0
firebase_auth: ^1.2.0
Flutter 代码(main.dart)
import 'package:firebase_auth/firebase_auth.dart';
import 'package:firebase_core/firebase_core.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
FirebaseAuth fa = FirebaseAuth.instance;
void main() async {
WidgetsFlutterBinding.ensureInitialized();
if (!kIsWeb) {
await Firebase.initializeApp();
}
runApp(MyApp());
}
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Auth Demo',
home: AuthDemo(),
);
}
}
class AuthDemo extends StatelessWidget {
const AuthDemo({Key key}) : super(key: key);
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("AuthDemo"),
),
body: Column(
children: [
ElevatedButton(
onPressed: () async {
await fa.signInAnonymously();
},
child: Text("Anon"),
),
ElevatedButton(
onPressed: () async {
await fa.signOut();
},
child: Text("SignOut"),
),
SizedBox(height: 20),
StreamBuilder(
stream: fa.authStateChanges(),
builder: (context, snapshot) {
return Text(snapshot.data?.uid ?? "[NULL]");
},
)
],
),
);
}
}
基本上,它会在页面重新加载时或登录后返回 UID,但当热重新加载完成时,即使用户实际上已登录,它也会显示 null。这正是问题所在!
请注意
我尝试使用两个插件的 v1.0.0 对其进行测试,以验证我的 flutter 版本是否不兼容,但这也不起作用。对于以下依赖版本,这完全符合我的预期(在热重载时打印 UID):
firebase_core: "^0.7.0"
firebase_auth: "^0.20.1"
这非常非常令人沮丧,控制台或任何地方绝对没有错误、警告。登录有效,但身份验证状态不会在 Web 中热重载时持续存在,(在 Android 上完美运行)但它仅适用于这些旧版本的网络。这是一个错误吗?如果没有请帮助我。
谢谢!
玛纳斯·赫吉马迪
最佳答案
我刚刚找到了解决这个问题的方法!基本上,FireFlutter 团队修复了生产级别的错误,从而暴露了 Dart SDK 的缺陷。由于这只是一个仅开发的错误(仅在热重启期间的错误),因此没有得到重视。
在我的研究中,我发现支持 StreamBuilder 和热重启的最后一个版本组合是
firebase_auth: 0.20.1;firebase_core 0.7.0
firebase_auth: 1.1.0;firebase_core: 1.0.3
这些是它唯一可以正常工作的版本。每个后续版本都有新的升级暴露了该错误。
解决方案非常简单!也适用于最新版本(1.2.0)的 firebase_auth 和 firebase_core 插件!
首先导入共享首选项
import 'package:firebase_auth/firebase_auth.dart';
import 'package:flutter/foundation.dart' as Foundation;
import 'package:flutter/material.dart';
import 'package:shared_preferences/shared_preferences.dart';
class HotRestartBypassMechanism {
///The Standard SharedPreference instance
static final Future<SharedPreferences> prefs =
SharedPreferences.getInstance();
///Saves the Login State (true) for LoggedIn and (false) for LoggedOut
static saveLoginState(bool isLoggedIn) async {
//Ignore Operation if Not in DebugMode on Web
if (!Foundation.kDebugMode && !Foundation.kIsWeb) return;
SharedPreferences p = await prefs;
p.setBool('is_logged_in', isLoggedIn);
}
///Gets the login status from SharedPreferences
static Future<bool> getLoginStatus() async {
SharedPreferences p = await prefs;
return p.getBool('is_logged_in') ?? false;
}
}
class HotRestartByPassBuilder extends StatelessWidget {
final Widget destinationFragment;
final Widget loginFragment;
const HotRestartByPassBuilder({
Key key,
this.destinationFragment,
this.loginFragment,
}) : super(key: key);
@override
Widget build(BuildContext context) {
return FutureBuilder<bool>(
future: HotRestartBypassMechanism.getLoginStatus(),
builder: (context, snapshot) {
if (snapshot.connectionState == ConnectionState.done) {
if (snapshot.data) {
return destinationFragment;
} else {
return loginFragment;
}
} else {
return loginFragment;
}
},
);
}
}
//Usage In StreamBuilder
StreamBuilder(
stream: FirebaseAuth.instance.authStateChanges(),
builder: (context, snapshot) {
if (snapshot.hasData) {
return HomePage();
} else {
//Only in Debug Mode & in Web
if (Foundation.kDebugMode && Foundation.kIsWeb) {
//---------------------HOT RESTART BYPASS--------------------------
return HotRestartByPassBuilder(
destinationFragment: HomePage(),
loginFragment: LoginPage(),
);
//-----------------------------------------------------------------
} else {
return LoginPage();
}
}
},
);
//When User Logs in Use
await HotRestartBypassMechanism.saveLoginState(true);
//When User Logs out use
await HotRestartBypassMechanism.saveLoginState(false);
这可以确保它在 Flutter Web 热重启期间按预期工作!
关于android - Flutter:带有 StreamBuilder 的 FirebaseAuth (v1.2.0) 无法在 Flutter Web 中进行热重载,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/67695213/
我正在尝试从flutter应用程序构建apk,但出现此错误: Note: /mnt/Software/Linux/Flutter/flutter/.pub-cache/hosted/pub.dartl
我有一个名为 X 的较大应用程序,还有另一个名为 Y 的较小应用程序。他们现在彼此分开,并且工作正常。我想将应用程序 Y 集成到 X 中。我想将 Y 的代码放入 X 项目中,但它们应该有不同的 Mai
在android Studio中选择Create New Flutter Project,出现如下4个选项。 Flutter 应用程序 Flutter 插件 Flutter 包 flutter 模块
我看到我的 flutter 项目生成了一个文件 ios/Flutter/Flutter.podspec ,这个文件有什么用? 如果它与生成的 Flutter.framework 有关? 我应该将它包含
我尝试过的 在包含flutter SDK的位置添加/编辑.bash_profile.rtf文件。 导出PATH = / Users / temur / Documents / Projects / F
Flutter 日志会打印数千个详细/垃圾邮件日志。 我正在尝试调试一个复杂的应用程序,但是打印太冗长了,以至于我很难找到我自己打印的东西。 有没有办法禁用详细? 就像是: Logger.level.
在flutter 1.22更新之后,我在Lineargradient colors属性中遇到错误,这给我一个错误,即未定义名称colors参数。.在Android中更新flutter和flutter插
在下面的代码 widget.hintText 中给出错误,我试图将日期选择器作为单独的组件,并在从其他文件调用它时动态传递提示文本值。 import 'package:date_field/date_
在下面的代码 widget.hintText 中给出错误,我试图将日期选择器作为单独的组件,并在从其他文件调用它时动态传递提示文本值。 import 'package:date_field/date_
Flutter 1.0 发布后,我正在按照步骤搭建 Flutter 开发环境。 在步骤中(如所附屏幕截图所示),它说要更新 $PATH 两次,一次使用 flutter 工具的路径 export PAT
我有一个用 flutter 编写的移动应用程序,我想将其转换为 flutter_web 应用程序(集成 flutter_web 尚不可用)。我目前遇到包裹问题。 我已按照本网站中列出的说明进行操作 h
如何向我的 Flutter 路由添加自定义转换?这是我目前的路线结构。 class MyApp extends StatelessWidget { // This widget is the
我正在尝试通过 URL 在 webview 中显示网页。我试过 flutter_webview_plugin 插件,但是当我在浏览器上运行项目时它不起作用。 在 flutter web applica
我正在使用 animatedContainer 在按下按钮时显示 listView.builder()。这是一个要显示的简单子(monad)列表,但问题是我不知道 ListView 构建器的高度会传递
我目前正在我的应用程序中制作渐变背景动画......我正在使用 lottie 动画的帮助下这样做!我试图将它封装在一个容器中并成功地做到了。但是有一个问题,尽管我将高度更改为大于 2000 的东西,但
美好的一天! 我无法弄清楚如何使用 google 标签管理器设置 flutter。我找到了 this package包括标签管理器 api。但是我不知道如何正确配置它。 (在网络上我只需要复制粘贴一个
我的购物车模型如下 class Cart { String description; double unitCost; double amount; int quantity; S
在 Flutter 应用程序中,我想为在线托管的资源(图像、视频等)实现缓存。 我希望它能在原生平台 (Android/iOS)(例如使用文件系统)和网络(例如使用 IndexedDB)上运行。 Fl
我写了一个页面,在顶部一切都很好,应该是这样。在底部我有一个事件的历史。我的容器的宽度是自动确定的(取决于屏幕的宽度),而高度 - 不,在不同的设备上有不同的高度(底部的缩进是不同的)。是否可以自动确
我正在处理一个页面,其中有一些字段,例如 textfield 和 slider。在页面的末尾必须有一个用于进行下一步的按钮,该按钮被包裹在 Align 中以在页面之间具有固定位置。 另一方面,resi
我是一名优秀的程序员,十分优秀!