Flutter钉钉授权登录插件dingtalk_auth的使用

Flutter钉钉授权登录插件dingtalk_auth的使用

设置

Android

权限声明

AndroidManifest.xml文件中添加以下权限:

<uses-permission
    android:name="android.permission.INTERNET" />
<!-- 如果您的应用目标SDK版本大于等于30,请添加以下权限声明 -->
<uses-permission android:name="android.permission.QUERY_ALL_PACKAGES" />

最低SDK版本设置

&lt;project root&gt;/android/app/build.gradle文件中将minSdkVersion设置为21:

android {
    defaultConfig {
        minSdkVersion 21
    }
}

安装

在项目的pubspec.yaml文件中添加依赖:

dependencies:
  dingtalk_auth: ^latest

然后运行flutter pub get来安装该插件。

导入

在Dart文件中导入插件:

import 'package:dingtalk_auth/dingtalk_auth.dart';

使用

获取授权码

首先定义一个参数对象,并调用authLogin方法获取授权码:

const params = DingTalkAuthParam(
  appId: 'your app(client) id', // 替换为你的应用ID
  redirectUrl: 'your redirect url', // 替换为你的重定向URL
);

// 调用授权登录方法
final authCode = await DingtalkAuth.authLogin(params);

获取用户访问令牌

通过HTTP请求获取用户访问令牌:

final data = {
  "clientId": "your client id", // 替换为你的客户端ID
  "clientSecret": "your client secret", // 替换为你的客户端密钥
  "code": "auth code from dingtalk", // 上一步获取到的授权码
  "grantType": "authorization_code"
};

// 发送POST请求获取访问令牌
final res = await Http().post(
  'https://api.dingtalk.com/v1.0/oauth2/userAccessToken',
  data: data,
);

示例代码

以下是完整的示例代码,展示了如何使用dingtalk_auth插件进行钉钉授权登录:

import 'dart:async';

import 'package:dingtalk_auth/dingtalk_auth.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.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> {
  String _authCode = '点击Auth按钮获取授权码';

  // 平台消息是异步的,所以我们在这里初始化
  Future<void> authLogin() async {
    String authCode;
    // 平台消息可能会失败,所以我们使用try/catch来捕获PlatformException。
    // 我们还处理了消息可能返回null的情况。
    try {
      authCode = await DingtalkAuth.authLogin(
            const DingTalkAuthParam(appId: '', redirectUrl: ''),
          ) ??
          '未知平台版本';
    } on PlatformException {
      authCode = '获取授权码失败。';
    }

    // 如果在异步平台消息还在飞行时,组件从树中被移除,则我们想要丢弃回复而不是调用
    // setState来更新我们的非存在的外观。
    if (!mounted) return;

    setState(() {
      _authCode = authCode;
    });
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text('插件示例应用'),
        ),
        body: Center(
          child: Text('授权码: $_authCode\n'),
        ),
        bottomNavigationBar: Padding(
          padding: const EdgeInsets.all(12.0),
          child: ElevatedButton(
            onPressed: authLogin,
            child: const Text('授权'),
          ),
        ),
      ),
    );
  }
}

更多关于Flutter钉钉授权登录插件dingtalk_auth的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter钉钉授权登录插件dingtalk_auth的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


当然,以下是如何在Flutter项目中使用dingtalk_auth插件来实现钉钉授权登录的代码示例。这个插件允许你通过钉钉进行OAuth2授权,获取用户的钉钉信息。

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

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

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

接下来,你需要配置钉钉的相关信息。在钉钉开发者后台创建一个应用,获取AppKey和AppSecret,并配置重定向URI(Redirect URI)。

以下是一个简单的Flutter应用示例,展示如何使用dingtalk_auth插件进行钉钉授权登录:

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

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter DingTalk Auth Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: DingTalkAuthScreen(),
    );
  }
}

class DingTalkAuthScreen extends StatefulWidget {
  @override
  _DingTalkAuthScreenState createState() => _DingTalkAuthScreenState();
}

class _DingTalkAuthScreenState extends State<DingTalkAuthScreen> {
  final DingTalkAuth _dingTalkAuth = DingTalkAuth();

  String _authResult = '';

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('DingTalk Auth Demo'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text(
              'Auth Result: $_authResult',
              style: TextStyle(fontSize: 20),
            ),
            SizedBox(height: 20),
            ElevatedButton(
              onPressed: () async {
                try {
                  // 替换为你的AppKey和Redirect URI
                  final String appKey = 'your_app_key';
                  final String redirectUri = 'your_redirect_uri';
                  final String state = 'random_state_string'; // 可选,用于防止CSRF攻击

                  // 获取授权URL
                  final String authUrl = await _dingTalkAuth.getAuthUrl(
                    appKey: appKey,
                    redirectUri: redirectUri,
                    state: state,
                  );

                  // 在实际应用中,你通常会打开一个WebView或系统浏览器来访问这个URL
                  // 这里只是简单地打印出来
                  print('Open this URL in a WebView or browser: $authUrl');

                  // 假设用户已经完成了授权,并且重定向回你的Redirect URI
                  // 你需要捕获这个重定向,并提取code参数
                  // 例如,假设你捕获到的重定向URL是:your_redirect_uri?code=some_code&state=random_state_string
                  // 你可以从URL中提取code
                  final String code = 'some_code'; // 这里应该是从重定向URL中提取的实际code

                  // 使用code获取access_token和用户信息
                  final Map<String, dynamic> authData = await _dingTalkAuth.getAuthData(
                    appKey: appKey,
                    appSecret: 'your_app_secret', // 替换为你的AppSecret
                    code: code,
                  );

                  // 更新状态显示结果
                  setState(() {
                    _authResult = authData.toString();
                  });
                } catch (e) {
                  setState(() {
                    _authResult = 'Error: ${e.message}';
                  });
                }
              },
              child: Text('Login with DingTalk'),
            ),
          ],
        ),
      ),
    );
  }
}

在这个示例中:

  1. 我们创建了一个简单的Flutter应用,其中包含一个按钮,用户点击该按钮将开始钉钉授权流程。
  2. 使用_dingTalkAuth.getAuthUrl方法获取钉钉的授权URL。
  3. 在实际应用中,你需要在一个WebView或系统浏览器中打开这个URL。用户完成授权后,钉钉将重定向到你配置的Redirect URI,并附带一个code参数。
  4. 捕获重定向URL,提取code参数。
  5. 使用_dingTalkAuth.getAuthData方法,结合AppKey、AppSecret和code,获取用户的access_token和其他信息。
  6. 更新UI显示授权结果。

注意:在实际应用中,处理重定向URL和提取code参数的部分通常涉及在WebView或系统浏览器中打开URL,并监听重定向事件。这个示例中简化了这部分流程,仅用于演示。你需要根据具体需求实现重定向处理逻辑。

回到顶部