Flutter客户端通信插件drf_client的使用

Flutter客户端通信插件drf_client的使用

帮助您自动认证并存储令牌，并在需要时刷新它们，同时使用这些令牌进行API请求。

该项目仍在开发中。查看GitHub代码并贡献 👉 https://github.com/Otajonov/drf_client

特性

• ✅ 自动使用Flutter安全存储存储令牌
• ✅ 自动刷新令牌
• ✅ 支持Django Oauth Toolkit的Oauth2
• ✅ 使用身份验证凭据轻松调用REST API
• ✅ 更多功能即将推出 …

开始使用

要开始使用此包，请将其添加到您的依赖项中，运行以下命令：

flutter pub add drf_client

或者，在您的pubspec.yaml文件下的dependencies部分添加以下行：

dependencies:  
  flutter:  
    sdk: flutter
  # your other dependencies ...
  
  drf_client: <latest_version>

然后在所需文件中导入该包：

import 'package:drf_client/drf_client.dart'; 

享受编码！

使用方法

首先，初始化配置：

void main() {
  // 现有代码

  DrfClient client = DrfClient();
  client.addConfig('your-app', DrfConfig(
    authType: AuthType.drfBuiltInAuth,
    baseUrl: 'https://your-app.com/api',
    tokenUrl: 'https://your-app.com/api/token',
    refreshTokenUrl: 'https://your-app.com/api/token/refresh',

    usernameField: 'username', // 默认用户名，如果您使用自定义用户模型，请更改此值
    passwordField: 'password', // 默认密码，如果您更改了用户模型中的密码字段，请更改此值
    refreshField: 'refresh_token', // 如果使用JWT，请根据您的令牌刷新逻辑更改此值

    // 如果使用Django-oauth-toolkit的授权码，请设置以下内容
    // oauthConfig: OauthConfig(
    //   clientId: "",
    //   clientSecret: "",
    //   authorizationEndpointUrl: "https://ilmchat.com/auth/authorize/",
    //   redirectScheme: 'you-app-shceme'
    // )
  ));
}

您可以设置多个配置，以便在同一代码中通过给定的应用名称对多个Django服务器进行请求和认证。

用户认证

通过drfBuiltInAuth进行认证：

DrfClient client = DrfClient();

client.loginDrfBuiltIn()

发起请求

DrfClient client = DrfClient();

client.get() // post() put() patch() delete()

如果已登录，它将使用存储的用户令牌进行请求。如果您不想在身份验证头中包含令牌，可以设置includeToken: false。

完整示例Demo

以下是一个完整的示例，展示了如何使用drf_client插件进行用户认证和API请求：

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

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

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

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: const MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

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

  final String title;

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

class _MyHomePageState extends State<MyHomePage> {
  int _counter = 0;
  DrfClient client = DrfClient();

  [@override](/user/override)
  void initState() {
    super.initState();
    // 初始化配置
    client.addConfig('your-app', DrfConfig(
      authType: AuthType.drfBuiltInAuth,
      baseUrl: 'https://your-app.com/api',
      tokenUrl: 'https://your-app.com/api/token',
      refreshTokenUrl: 'https://your-app.com/api/token/refresh',
      usernameField: 'username',
      passwordField: 'password',
      refreshField: 'refresh_token',
    ));

    // 登录
    client.loginDrfBuiltIn();
  }

  void _incrementCounter() {
    setState(() {
      _counter++;
    });
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            const Text(
              'You have pushed the button this many times:',
            ),
            Text(
              '$_counter',
              style: Theme.of(context).textTheme.headlineMedium,
            ),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _incrementCounter,
        tooltip: 'Increment',
        child: const Icon(Icons.add),
      ),
    );
  }
}