Flutter微软认证登录插件msal_auth_flutter的使用

Flutter微软认证登录插件msal_auth_flutter的使用

本项目是一个用于Flutter的插件包，包含了针对Android和/或iOS平台的具体实现代码。

开始使用

对于刚开始进行Flutter开发的用户，可以参考在线文档，该文档提供了教程、示例、移动开发指导以及完整的API参考。

示例代码

以下是使用msal_auth_flutter插件的基本示例：

import 'dart:ffi';

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

import 'package:flutter/services.dart';
import 'package:msal_auth_flutter/msal_auth_flutter.dart';

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

class MyApp extends StatefulWidget {
  const MyApp({super.key});

  [@override](/user/override)
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  bool? _isInitialized = false;
  final _msalAuthFlutterPlugin = MsalAuthFlutter();

  [@override](/user/override)
  void initState() {
    super.initState();
    initPlatformState();
  }

  // 平台消息是异步的，所以我们通过异步方法初始化。
  Future<void> initPlatformState() async {
    bool? isInitialized;
    // 平台消息可能会失败，因此我们使用try/catch来捕获PlatformException。
    // 我们也处理消息可能返回null的情况。
    try {
      isInitialized = 
          await _msalAuthFlutterPlugin.initialize('assets/auth_config_single_account.json');
    } on PlatformException {
      isInitialized = false;
    }

    // 如果在异步平台消息飞行期间小部件从树中移除，我们应该丢弃回复而不是调用setState来更新我们的非存在外观。
    print("🚀 isInitialized: $isInitialized");
    if (!mounted) return;
    setState(() {
      print("🚀 setState called isInitialized: $isInitialized");
      _isInitialized = isInitialized;
    });
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    print("🚀 build called isInitialized: $_isInitialized");
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text('插件示例应用'),
        ),
        body: Center(
          child: Column(
            children: [
              Text('已初始化: $_isInitialized\n'),
              TextButton(onPressed: () {
                 _msalAuthFlutterPlugin.acquireToken(List.filled(1, "user.read")).then((value) {
                   print("🚀 Token: $value");
                 }).catchError((err) {
                   print(err.toString());
                 });
              }, child: const Text("登录")),
              TextButton(onPressed: () {
                _msalAuthFlutterPlugin.logout().then((value) {
                  print("🚀 登出: $value");
                });
              }, child: const Text("登出"))
            ],
          ),
        ),
      ),
    );
  }
}

更多关于Flutter微软认证登录插件msal_auth_flutter的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

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


msal_auth_flutter 是一个用于在 Flutter 应用中实现 Microsoft 认证登录的插件。它基于 Microsoft Authentication Library (MSAL) 开发，允许用户通过 Microsoft 账户进行身份验证和授权。

下面是如何在 Flutter 项目中使用 msal_auth_flutter 插件的步骤：

1. 添加依赖

首先，在 pubspec.yaml 文件中添加 msal_auth_flutter 插件的依赖：

dependencies:
  flutter:
    sdk: flutter
  msal_auth_flutter: ^0.0.1 # 请检查最新版本

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

2. 配置 Azure AD 应用

在使用 msal_auth_flutter 之前，你需要在 Azure Active Directory (Azure AD) 中注册一个应用程序，并获取必要的客户端 ID 和重定向 URI。

  1. 登录到 Azure 门户。
  2. 在左侧导航栏中选择 Azure Active Directory。
  3. 选择 应用注册，然后点击 新注册。
  4. 输入应用名称，并选择支持的账户类型。
  5. 在 重定向 URI 中，添加一个适用于移动应用的 URI，例如 msauth://your.package.name。
  6. 注册完成后，记下 应用程序（客户端）ID。

3. 初始化插件

在 Flutter 应用中初始化 msal_auth_flutter 插件。通常可以在 main.dart 中进行初始化：

import 'package:msal_auth_flutter/msal_auth_flutter.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  
  await MsalAuthFlutter.init(
    clientId: 'YOUR_CLIENT_ID', // 你的 Azure AD 客户端 ID
    authority: 'https://login.microsoftonline.com/YOUR_TENANT_ID', // 你的租户 ID
    redirectUri: 'msauth://your.package.name', // 你的重定向 URI
    scopes: ['User.Read'], // 请求的权限范围
  );

  runApp(MyApp());
}

4. 登录和注销

使用 MsalAuthFlutter 提供的 API 进行登录和注销操作。

登录

import 'package:msal_auth_flutter/msal_auth_flutter.dart';

Future<void> signIn() async {
  try {
    final result = await MsalAuthFlutter.signIn();
    print('Access Token: ${result.accessToken}');
    print('ID Token: ${result.idToken}');
  } catch (e) {
    print('Sign in failed: $e');
  }
}

注销

import 'package:msal_auth_flutter/msal_auth_flutter.dart';

Future<void> signOut() async {
  try {
    await MsalAuthFlutter.signOut();
    print('Signed out successfully');
  } catch (e) {
    print('Sign out failed: $e');
  }
}

5. 获取用户信息

登录成功后，你可以使用访问令牌来调用 Microsoft Graph API 获取用户信息。

import 'package:http/http.dart' as http;

Future<void> getUserInfo(String accessToken) async {
  final response = await http.get(
    Uri.parse('https://graph.microsoft.com/v1.0/me'),
    headers: {
      'Authorization': 'Bearer $accessToken',
    },
  );

  if (response.statusCode == 200) {
    print('User Info: ${response.body}');
  } else {
    print('Failed to fetch user info: ${response.statusCode}');
  }
}

6. 处理回调

在 AndroidManifest.xml 和 Info.plist 中配置回调 URI，以确保登录完成后能够正确返回到应用。

Android

在 android/app/src/main/AndroidManifest.xml 中添加以下内容：

<activity
    android:name="com.microsoft.identity.client.BrowserTabActivity">
    <intent-filter>
        <action android:name="android.intent.action.VIEW" />
        <category android:name="android.intent.category.DEFAULT" />
        <category android:name="android.intent.category.BROWSABLE" />
        <data android:scheme="msauth"
              android:host="your.package.name" />
    </intent-filter>
</activity>

iOS

在 ios/Runner/Info.plist 中添加以下内容：

<key>CFBundleURLTypes</key>
<array>
    <dict>
        <key>CFBundleURLSchemes</key>
        <array>
            <string>msauth.$(PRODUCT_BUNDLE_IDENTIFIER)</string>
        </array>
    </dict>
</array>
回到顶部