Flutter JWT处理插件gazelle_jwt的使用

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

Flutter JWT处理插件gazelle_jwt的使用

Gazelle JWT Plugin

Gazelle JWT插件提供了JSON Web Token (JWT)认证能力，适用于Gazelle框架。 该插件允许您通过将基于JWT的身份验证集成到您的Gazelle应用程序中来轻松地保护您的路由。

此插件基于dart_jsonwebtoken库。

开始使用

要安装Gazelle JWT插件，请将其添加到您的pubspec.yaml文件中：

dependencies:
  gazelle_core: <latest-version>
  gazelle_jwt: <latest-version>

然后，运行dart pub get或flutter pub get以安装该包。

示例用法

以下是一个快速示例，说明如何使用GazelleJwtPlugin:

import 'package:gazelle_core/gazelle_core.dart';
import 'package:gazelle_jwt/gazelle_jwt.dart';

void main() async {
  // 初始化您的Gazelle应用。
  final app = GazelleApp(
    routes: [
      GazelleRoute(
        name: "login",
        post: (context, request, response) async {
          // 使用请求获取来自客户端的数据。
          return GazelleResponse(
            statusCode: GazelleHttpStatusCode.success.ok_200,
            // 签名一个令牌并发送回客户端。
            body: context.getPlugin<GazelleJwtPlugin>().sign({"test": "133"}),
          );
        },
      ),
      GazelleRoute(
        name: "hello_world",
        get: (context, request, response) async {
          return GazelleResponse(
            statusCode: GazelleHttpStatusCode.success.ok_200,
            body: "Hello, World!",
          );
        },
        // 添加由插件提供的身份验证钩子以保护您的路由。
        preRequestHooks: (context) =&gt; [
          context.getPlugin<GazelleJwtPlugin>().authenticationHook,
        ],
      ),
    ],
    plugins: [GazelleJwtPlugin(SecretKey("supersecret"))],
  );

  // 启动您的服务器。
  await app.start();
}

客户端示例

import 'package:gazelle_core/gazelle_core.dart';
import 'package:gazelle_jwt/gazelle_jwt.dart';
import 'package:http/http.dart';

void main() async {
  // 初始化您的Gazelle应用。
  final app = GazelleApp(
    routes: [
      GazelleRoute(
        name: "login",
      ).post((context, request) =&gt; GazelleResponse(
            statusCode: GazelleHttpStatusCode.success.ok_200,
            body: context.getPlugin&lt;GazelleJwtPlugin&gt;().sign({"test": "133"}),
          )),
      GazelleRoute(
        name: "hello_world",
        // 添加由插件提供的身份验证钩子以保护您的路由。
        preRequestHooks: (context) =&gt; [
          context.getPlugin&lt;GazelleJwtPlugin&gt;().authenticationHook,
        ],
      ).get((context, request) =&gt; GazelleResponse(
            statusCode: GazelleHttpStatusCode.success.ok_240,
            body: "Hello, World!",
          )),
    ],
    plugins: [GazelleJwtPlugin(SecretKey("supersecret"))],
  );

  // 启动您的服务器。
  await app.start();

  // 客户端
  final baseUrl = app.serverAddress;

  // 请求令牌。
  final token =
      await http.post(Uri.parse("$baseUrl/login")).then((e) =&gt; e.body);

  // 认证您的请求。
  final result = await http.get(Uri.parse("$baseUrl/hello_world"), headers: {
    "Authorization": "Bearer $token",
  });

  print(result.body); // 打印"Hello, World!"

  await app.stop(force: true);
}

更多关于Flutter JWT处理插件gazelle_jwt的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html

Harmonyos Next教程
1 回复

更多关于Flutter JWT处理插件gazelle_jwt的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


当然，以下是如何在Flutter应用中使用gazelle_jwt插件来处理JWT（JSON Web Tokens）的示例代码。gazelle_jwt插件允许你解析和验证JWT。

首先，确保你已经在你的pubspec.yaml文件中添加了gazelle_jwt依赖：

dependencies:
  flutter:
    sdk: flutter
  gazelle_jwt: ^x.y.z  # 替换为最新版本号

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

接下来是一个简单的示例，展示如何使用gazelle_jwt来解析和验证JWT。

示例代码

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

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

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  String decodedToken = '';

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('Flutter JWT Example'),
        ),
        body: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Text('Decoded Token:'),
              Text(decodedToken),
              SizedBox(height: 20),
              ElevatedButton(
                onPressed: () async {
                  String token = 'your.jwt.token.here';  // 替换为你的JWT
                  String secretKey = 'your_secret_key';  // 替换为你的密钥

                  try {
                    var jwt = Jwt.parse(token, secretKey: secretKey);
                    setState(() {
                      decodedToken = jwt.claims.toString();
                    });
                  } catch (e) {
                    setState(() {
                      decodedToken = 'Error decoding token: $e';
                    });
                  }
                },
                child: Text('Decode JWT'),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

代码说明

  1. 依赖导入：导入flutter和gazelle_jwt包。
  2. 主应用：定义一个简单的Flutter应用，包含一个按钮和一个文本显示区域。
  3. JWT解析：
    • 在按钮点击事件中，定义一个JWT字符串和一个密钥字符串。
    • 使用Jwt.parse方法解析JWT。
    • 如果解析成功，将JWT的声明（claims）转换为字符串并显示在屏幕上。
    • 如果解析失败，捕获异常并显示错误信息。

注意事项

  • 确保你的JWT和密钥是有效的。
  • 在生产环境中，不要硬编码密钥，请使用安全的密钥管理方式。
  • 根据需要处理JWT的过期时间和其他验证逻辑。

这个示例展示了如何使用gazelle_jwt插件在Flutter应用中解析JWT。你可以根据实际需求进一步扩展此示例，例如添加更多的验证逻辑或处理不同类型的JWT声明。

回到顶部