使用 Flutter 进行 Appwrite 电话身份验证

电话身份验证是移动应用程序最可靠的身份验证方法之一。Appwrite 现在在我们最近的版本中引入了电话身份验证。在本文中，我们将学习如何在我们的 Flutter 应用程序中实现 Appwrite 的手机认证。

Appwrite ？

Appwrite是一种开源后端即服务，它通过为您的核心后端需求提供一组 REST 和实时 API，抽象出构建现代应用程序的所有复杂性。Appwrite 最大限度地减少了开发人员的繁重工作，并处理用户身份验证和授权、数据库、文件存储、云功能、webhook 等等！

先决条件

• 访问 Appwrite 项目或创建项目的权限。如果您还没有运行 Appwrite 服务器，请按照官方安装教程获取设置说明。
• 一个Flutter配置的开发机器。

Twilio 帐户设置

我们首先需要设置一个电话服务提供商进行身份验证。Twilio 是一种流行的选择——Twilio 帐户可以提供 API 访问密钥，允许 Appwrite 将代码发送到手机。如果您没有现有的 Twilio 帐户，您可以访问https://www.twilio.com/try-twilio并使用您的电子邮件和密码创建一个免费帐户。通过电子邮件，您将收到一个验证链接，单击该链接将验证您的 Twilio 帐户。它还会要求您验证您的电话号码。

输入您的电话号码，然后单击“验证”按钮。然后，您将通过 SMS 收到一个代码。在 Twilio 中输入收到的代码，然后单击提交以确认您的号码。

在下一个屏幕上，输入您的选择。您选择哪种编码语言并不重要，因为我们会将 Twilio 与 Appwrite 集成，因此我们不必直接与 Twilio 交互。接下来，单击开始使用 Twilio按钮。

然后，您应该被重定向到 Twilio 控制台。单击获取您的 Twilio 号码按钮。初始试用帐户只能向您已验证的号码发送短信和电话，并且对于测试而言，这是完美的。但是，对于生产用途，您必须升级您的 Twilio 帐户。

您可以在控制台中看到 Account SID、Auth Token 和 Phone number。在下一个会话中，您将需要这些将 Twillio 设置为 Appwrite 可以使用的 SMS 提供程序。您的 Twilio 帐户现在应该已准备好与 Appwrite 集成。

应用程序设置

按照官方指南设置和运行 Appwrite。为了让 Appwrite 了解 Appwrite，我们需要.env从您安装 Appwrite 的 appwrite 目录打开文件，并更新以下环境变量。

_APP_PHONE_PROVIDER=phone://:@twilio
_APP_PHONE_FROM=

更新环境变量后，从包含.env和docker-compose.yml文件的安装目录中的命令行运行以下命令。

docker-compose up -d

这将重新启动容器，为环境变量提供新值，因此 Appwrite 可以连接到 Twilio。我们现在准备在我们的应用程序中实现电话身份验证。

安装和配置 Appwrite 的 Flutter SDK

克隆我们为本教程创建的项目让我们跳过设置和 UI 部分，并专注于主要主题。克隆https://github.com/lohanidamodar/appwrite_phone_auth.git。克隆后，在您最喜欢的 IDE 中打开它。

我们将从添加 Appwrite 的 SDK 作为依赖项开始。打开pubspec.yaml文件，在依赖项下添加 Appwrite 的 SDK。

dependencies:
    appwrite: ^6.0.0

如果 IDE 没有自动获取依赖项，请从终端运行以下命令。

flutter pub get

接下来，打开lib/providers/app_state.dart文件。这是我们将配置我们的 Appwrite SDK 的地方。首先，导入appwrite包。

import 'package:appwrite/appwrite.dart';
import 'package:appwrite/models.dart'; // Response type definitions

在 AuthState 类中，添加新属性。

class AuthState extends ChangeNotifier {
  final _client = Client();
  late final Account  _account;
}

然后在构造函数中，让我们配置客户端并实例化帐户。

  AuthState() {
    _client.setEndpoint('YOUR_ENDPOINT')
       .setProject(‘YOUR_PROJECT_ID’);
    _account = Account(client);
  }

安装和配置 SDK 后，最后一步是将平台添加到我们的 Appwrite 项目中。打开 Appwrite 控制台并选择您为此应用程序创建的项目。您可以在项目主页上找到添加平台按钮。点击Add Platform按钮并选择New Flutter App。在出现的对话框中，选择合适的 Flutter 平台，为其指定一个可识别的名称，并根据平台添加应用程序 ID 或包名称。您必须为您在应用程序中构建的每个 Flutter 平台完成此步骤。

现在我们的 SDK 已经安装和配置好了，我们准备在我们的应用程序中实现电话身份验证。

使用电话创建会话

为具有电话号码的用户创建有效会话需要两个步骤。首先，要启动会话创建过程，我们将使用设置提供程序向提供的电话号码发送验证码。接下来，验证码将确认并为用户创建一个有效的会话。所以让我们在我们的AuthState类中实现这两个方法。

要启动会话，我们createPhoneSession从帐户服务调用并传递userId电话号码和电话号码。传递'unique()'asuserId允许 Appwrite 生成唯一的 Id。

  Future createSession(String phone) async {
    try {
      final token =
          await _account.createPhoneSession(userId: 'unique()', number: phone);
      userId = token.userId;
      return true;
    } on AppwriteException catch (e) {
      _error = e.message ?? e.toString();
      isLoggedIn = false;
      notifyListeners();
      return false;
    }
  }

调用createPhoneSession返回一个带有 的令牌对象userId。我们保存 是userId因为我们需要它来确认身份验证并创建有效会话。为此，我们需要updatePhoneSession从帐户服务调用。让我们按照confirmSession方法。

Future confirmSession(String secret) async {
    if (userId.isEmpty) {
      _error = 'userId not known, call `createSession` first to get userId';
      notifyListeners();
      return false;
    }
    try {
      await _account.updatePhoneSession(userId: userId, secret: secret);
      await getAccount();
      return true;
    } on AppwriteException catch (e) {
      _error = e.message ?? e.toString();
      isLoggedIn = false;
      return false;
    }
  }

现在让我们在适当的 UI 中调用这些方法。打开lib/login.dart并找到登录按钮。在按钮的onPressed动作中，勾选后添加如下代码。

final success = await ref
  .read(AuthState.provider.notifier)
  .createSession(_phoneController.text);
if (!mounted) return;
if (success) {
  Navigator.pushNamed(context, '/verify');
}

打开lib/verify_phone.dart并找到验证按钮。在按钮的onPressed动作中，勾选后添加如下代码。

final loggedIn = await ref
    .read(AuthState.provider.notifier)
    .confirmSession(currentText);
if (!mounted) return;
if (loggedIn) {
  Navigator.pushReplacementNamed(context, '/');
} else {
  ScaffoldMessenger.of(context).showSnackBar(SnackBar(
    content: Text(ref.read(AuthState.provider).error),
  ));
}

在这里，我们使用 SMS 中收到的代码调用 Appwrite。我们需要做的最后一件事是——我们需要打电话来获得一个帐户。打开lib/providers/app_state.dart并添加以下功能。

  Future getAccount() async {
    try {
      user = await _account.get();
      isLoggedIn = true;
      notifyListeners();
      return true;
    } on AppwriteException catch (e) {
      _error = e.message ?? e.toString();
      isLoggedIn = false;
      user = null;
      notifyListeners();
      return false;
    }
  }

在 的构造函数中调用这个函数AuthState，所以当应用程序启动时，它会检查我们是否已经有一个有效的会话。您现在可以运行应用程序并查看手机身份验证的实际效果。

结论

这就是使用 Appwrite 设置电话身份验证是多么容易。

我整理了一份flutter相关学习文档，大家如不嫌弃，可拿去做参考文档学习↓↓↓

有需要的可以复制下方链接，传送直达！！！
https://docs.qq.com/doc/DQkN3SnpnZVdoZkVv