Flutter身份认证插件authing_sdk的使用

发布于 1周前 作者 yibo5220 来自 Flutter

Flutter身份认证插件authing_sdk的使用

本文将介绍如何在Flutter项目中使用authing_sdk插件进行身份验证。我们将从添加依赖、初始化SDK到实现一些基本的身份验证功能,如注册、登录等。

一、添加依赖

首先,在你的pubspec.yaml文件中添加以下依赖:

dependencies:
  authing_sdk: ^1.0.0

然后运行flutter pub get来安装依赖。

二、SDK初始化

在应用启动时调用以下代码进行初始化:

import 'package:authing_sdk/authing.dart';

Authing.init(String userPoolId, String appId);

这里的userPoolId是你的Authing用户池ID,而appId则是你的应用ID。

如果你是在私有部署环境下使用,则需要额外调用如下方法设置相关信息:

Authing.setOnPremiseInfo(String host, String publicKey);

其中,host是你自己的域名(例如:mycompany.com),publicKey是你的组织公钥。

三、示例Demo

下面是一个完整的示例程序,演示了如何使用authing_sdk完成基本的登录操作。

import 'package:flutter/material.dart';
import 'package:authing_sdk/authing.dart';
import 'package:authing_sdk/client.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  final String poolId = "your_pool_id";
  final String appId = "your_app_id";

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Authing SDK Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Authing SDK Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key? key, required this.title}) : super(key: key);

  final String title;

  [@override](/user/override)
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  TextEditingController usernameController = TextEditingController();
  TextEditingController passwordController = TextEditingController();

  void login() async {
    Authing.init(widget.poolId, widget.appId);
    AuthResult result = await AuthClient.loginByAccount(usernameController.text, passwordController.text);
    if (result.code == 200) {
      ScaffoldMessenger.of(context).showSnackBar(SnackBar(content: Text('Login Success')));
    } else {
      ScaffoldMessenger.of(context).showSnackBar(SnackBar(content: Text('Login Failed')));
    }
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            TextField(
              controller: usernameController,
              decoration: InputDecoration(labelText: 'Username / Email / Phone'),
            ),
            TextField(
              controller: passwordController,
              obscureText: true,
              decoration: InputDecoration(labelText: 'Password'),
            ),
            ElevatedButton(
              onPressed: login,
              child: Text('Login'),
            ),
          ],
        ),
      ),
    );
  }
}

更多关于Flutter身份认证插件authing_sdk的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter身份认证插件authing_sdk的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


当然,以下是如何在Flutter项目中使用authing_sdk插件进行身份认证的示例代码。这个示例展示了如何进行用户注册、登录和获取用户信息的基本操作。

首先,确保你已经在pubspec.yaml文件中添加了authing_sdk依赖:

dependencies:
  flutter:
    sdk: flutter
  authing_sdk: ^最新版本号  # 请替换为实际的最新版本号

然后,运行flutter pub get来安装依赖。

接下来,在你的Flutter项目中,你可以按照以下步骤使用authing_sdk进行身份认证:

1. 初始化Authing SDK

在应用的入口文件(通常是main.dart)中,初始化Authing SDK:

import 'package:flutter/material.dart';
import 'package:authing_sdk/authing_sdk.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();

  // 初始化Authing SDK
  await Authing.init(
    appId: '你的AppId', // 替换为你的Authing AppId
    region: '你的Region', // 替换为你的Authing Region,例如 cn-hangzhou
  );

  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Authing Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: AuthScreen(),
    );
  }
}

2. 用户注册

创建一个注册页面,让用户可以输入邮箱和密码进行注册:

import 'package:flutter/material.dart';
import 'package:authing_sdk/authing_sdk.dart';

class RegisterScreen extends StatefulWidget {
  [@override](/user/override)
  _RegisterScreenState createState() => _RegisterScreenState();
}

class _RegisterScreenState extends State<RegisterScreen> {
  final _formKey = GlobalKey<FormState>();
  String _email = '';
  String _password = '';

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('用户注册'),
      ),
      body: Padding(
        padding: const EdgeInsets.all(16.0),
        child: Form(
          key: _formKey,
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: <Widget>[
              TextFormField(
                decoration: InputDecoration(labelText: '邮箱'),
                validator: (value) {
                  if (value.isEmpty || !value.contains('@')) {
                    return '请输入有效的邮箱地址';
                  }
                  return null;
                },
                onSaved: (value) => _email = value,
              ),
              TextFormField(
                decoration: InputDecoration(labelText: '密码'),
                obscureText: true,
                validator: (value) {
                  if (value.isEmpty || value.length < 6) {
                    return '密码至少6位';
                  }
                  return null;
                },
                onSaved: (value) => _password = value,
              ),
              SizedBox(height: 20),
              ElevatedButton(
                onPressed: () async {
                  if (_formKey.currentState!.validate()) {
                    _formKey.currentState!.save();

                    try {
                      await Authing.registerByEmail(
                        email: _email,
                        password: _password,
                      );
                      ScaffoldMessenger.of(context).showSnackBar(
                        SnackBar(content: Text('注册成功')),
                      );
                      // 跳转到登录页面或其他页面
                      Navigator.pushReplacementNamed(context, '/login');
                    } catch (e) {
                      ScaffoldMessenger.of(context).showSnackBar(
                        SnackBar(content: Text('注册失败: ${e.message}')),
                      );
                    }
                  }
                },
                child: Text('注册'),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

3. 用户登录

创建一个登录页面,让用户可以输入邮箱和密码进行登录:

class LoginScreen extends StatefulWidget {
  [@override](/user/override)
  _LoginScreenState createState() => _LoginScreenState();
}

class _LoginScreenState extends State<LoginScreen> {
  final _formKey = GlobalKey<FormState>();
  String _email = '';
  String _password = '';

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('用户登录'),
      ),
      body: Padding(
        padding: const EdgeInsets.all(16.0),
        child: Form(
          key: _formKey,
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: <Widget>[
              TextFormField(
                decoration: InputDecoration(labelText: '邮箱'),
                validator: (value) {
                  if (value.isEmpty || !value.contains('@')) {
                    return '请输入有效的邮箱地址';
                  }
                  return null;
                },
                onSaved: (value) => _email = value,
              ),
              TextFormField(
                decoration: InputDecoration(labelText: '密码'),
                obscureText: true,
                validator: (value) {
                  if (value.isEmpty) {
                    return '请输入密码';
                  }
                  return null;
                },
                onSaved: (value) => _password = value,
              ),
              SizedBox(height: 20),
              ElevatedButton(
                onPressed: () async {
                  if (_formKey.currentState!.validate()) {
                    _formKey.currentState!.save();

                    try {
                      User? user = await Authing.loginByEmail(
                        email: _email,
                        password: _password,
                      );
                      ScaffoldMessenger.of(context).showSnackBar(
                        SnackBar(content: Text('登录成功')),
                      );
                      // 保存用户信息或跳转到主页
                      // 例如:await Authing.saveUser(user!);
                      Navigator.pushReplacementNamed(context, '/');
                    } catch (e) {
                      ScaffoldMessenger.of(context).showSnackBar(
                        SnackBar(content: Text('登录失败: ${e.message}')),
                      );
                    }
                  }
                },
                child: Text('登录'),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

4. 获取用户信息

一旦用户登录成功,你可以使用Authing.getCurrentUser()方法来获取当前用户的信息:

void _getUserInfo() async {
  User? user = await Authing.getCurrentUser();
  if (user != null) {
    print('用户ID: ${user.id}');
    print('用户名: ${user.username}');
    print('邮箱: ${user.email}');
    // 其他用户信息...
  } else {
    print('未找到当前用户信息');
  }
}

你可以将这个方法调用放在适当的时机,例如在用户成功登录后的某个页面加载时。

5. 路由配置

确保你的应用中配置了路由,以便可以在注册和登录页面之间导航:

import 'package:flutter/material.dart';
import 'register_screen.dart';
import 'login_screen.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await Authing.init(appId: '你的AppId', region: '你的Region');

  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Authing Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      initialRoute: '/',
      routes: {
        '/': (context) => HomeScreen(),
        '/register': (context) => RegisterScreen(),
        '/login': (context) => LoginScreen(),
      },
    );
  }
}

class HomeScreen extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('主页'),
      ),
      body: Center(
        child: Elev
回到顶部