Flutter Firebase - 点击Firebase发送的电子邮件验证链接时如何打开应用程序？

Posted 2023-02-23

技术标签:

【中文标题】Flutter Firebase - 点击Firebase发送的电子邮件验证链接时如何打开应用程序？【英文标题】：Flutter Firebase - How to open the app when tapping on email verification link send by Firebase? 【发布时间】：2022-01-19 09:25:59 【问题描述】：

我可以在我的 Flutter 应用上通过 Firebase 发送电子邮件验证链接。但我想修改链接，以便当用户点击它时，它会将他们带到我定义的应用程序屏幕。所以基本上是深度链接。我环顾四周，找到了用于深度链接的资源，但它们都处理了自定义 url，并考虑到了时事通讯之类的东西。

但我希望修改 Firebase 在深层链接中发送的验证电子邮件，该深层链接会在应用中打开特定屏幕。

【问题讨论】：

你不想在那里使用深度链接，你可以去一个验证类，检查用户电子邮件是否经过验证，所以当你点击链接时，用户将得到验证和验证类将引导您到主屏幕您好，谢谢，但您能否为我指出一些资源，以了解如何实现这一点。谷歌在这里让我失望了。也不确定点击验证链接时这是否会打开应用程序好的，我会在答案部分添加一些代码。 【参考方案1】：

用户注册帐户后，您需要路由到一个新班级，其中初始化函数，您将发送一个sendEmailVerification();

见下面的代码

user = auth.currentUser!; 
user.sendEmailVerification();

在 initState() 中创建一个计时器，它会检查电子邮件是否被定期验证。

所以，说每五秒钟调用一次这个函数，它会检查电子邮件是否被验证。

参考下面的函数

Future<void> checkEmailVerified() async 
    user = auth.currentUser!;
    await user.reload();
    if (user.emailVerified) 
      timer.cancel();
      Navigator.of(context).pushNamed('/home');

如果用户电子邮件通过验证，则将用户转到主屏幕

并且还配置计时器

参考下面给出的完整代码

import 'dart:async';

import 'package:firebase_auth/firebase_auth.dart';
import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:service_provider/constant/constant.dart';
import 'package:sizer/sizer.dart';

class VerifyScreen extends StatefulWidget 
  @override
  _VerifyScreenState createState() => _VerifyScreenState();


class _VerifyScreenState extends State<VerifyScreen> 
  final auth = FirebaseAuth.instance;
  late User user;
  late Timer timer;
  @override
  void initState() 
    user = auth.currentUser!;
    user.sendEmailVerification();
    timer = Timer.periodic(Duration(seconds: 5), (timer) 
      checkEmailVerified();
    );
    super.initState();
  

  @override
  void dispose() 
    timer.cancel();
    super.dispose();
  

  @override
  Widget build(BuildContext context) 
    return Scaffold(
      backgroundColor: Colors.white,
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Padding(
              padding: const EdgeInsets.all(0.0),
              child: Image.asset('assets/images/gif.gif',
                  fit: BoxFit.contain, height: 18.h),
            ),
            Padding(
              padding: const EdgeInsets.all(25.0),
              child: RichText(
                text: TextSpan(
                  text: 'An email has been sent to ',
                  style: GoogleFonts.spartan(
                    color: Colors.black,
                    // textStyle: Theme.of(context).textTheme.headline4,
                    fontSize: 14,
                    fontWeight: FontWeight.w400,
                  ),
                  children: <TextSpan>[
                    TextSpan(
                      text: '"$user.email"',
                      style: GoogleFonts.spartan(
                        color: Color(Const.primary),
                        // textStyle: Theme.of(context).textTheme.headline4,
                        fontSize: 14,
                        fontWeight: FontWeight.w500,
                      ),
                    ),
                    const TextSpan(text: ' please verify'),
                  ],
                ),
              ),
            ),
          ],
        ),
      ),
    );
  

  Future<void> checkEmailVerified() async 
    user = auth.currentUser!;
    await user.reload();
    if (user.emailVerified) 
      timer.cancel();
      Navigator.of(context).pushNamed('/home');

注意

某些用户可以通过从此处关闭应用程序来跳过此过程。所以，你可以做的是，当用户再次登录时，检查用户是否被验证，如果用户的电子邮件没有被再次验证，则进入验证页面

谢谢

【讨论】：

对不起，这正是我正在做的，这正是我不想做的。我绝对需要为此进行深度链接。正如我在问题中所说，我希望验证链接“打开”应用程序并路由到相关屏幕，这样用户就不必手动访问应用程序。我不希望验证链接在浏览器中打开。希望我能让自己更清楚。