Flutter 中的 JWT 验证：保护 API 请求

Flutter 中的 JWT 验证：保护 API 请求

5 回复

使用JWT插件解析token，验证用户身份。

更多关于Flutter 中的 JWT 验证：保护 API 请求的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


在 Flutter 中，使用 http 或 dio 库发送 API 请求时，将 JWT 放入 Authorization 头中，如 Authorization: Bearer <token>，以保护 API 请求。

在 Flutter 中实现 JWT 验证以保护 API 请求，通常步骤如下：

  1. 获取 JWT：用户登录后，服务器返回 JWT。
  2. 存储 JWT：使用 flutter_secure_storage 或 shared_preferences 安全存储 JWT。
  3. 发送请求：在 API 请求的 Authorization 头中添加 JWT。
  4. 验证 JWT：服务器验证 JWT 的有效性，若无效则拒绝请求。

示例代码：

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

final storage = FlutterSecureStorage();

Future<void> fetchData() async {
  final token = await storage.read(key: 'jwt');
  final response = await http.get(
    Uri.parse('https://api.example.com/data'),
    headers: {'Authorization': 'Bearer $token'},
  );
  if (response.statusCode == 200) {
    // 处理数据
  } else {
    // 处理错误
  }
}

确保服务器正确处理 JWT 过期、刷新等场景。

使用JWT库解析令牌，验证签名和过期时间，确保请求合法。

在 Flutter 应用中，JWT（JSON Web Token）常用于保护 API 请求，确保只有经过身份验证的用户才能访问受保护的资源。以下是实现 JWT 验证的基本步骤：

1. 获取 JWT

用户登录成功后，服务器通常会返回一个 JWT。你需要将这个 JWT 存储在本地，以便后续的 API 请求中使用。

import 'package:shared_preferences/shared_preferences.dart';

Future<void> saveToken(String token) async {
  final prefs = await SharedPreferences.getInstance();
  await prefs.setString('jwt_token', token);
}

Future<String?> getToken() async {
  final prefs = await SharedPreferences.getInstance();
  return prefs.getString('jwt_token');
}

2. 将 JWT 添加到请求头

在发起 API 请求时，将 JWT 添加到请求头中。

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

Future<http.Response> fetchProtectedData() async {
  final token = await getToken();
  
  final response = await http.get(
    Uri.parse('https://your-api.com/protected'),
    headers: {
      'Authorization': 'Bearer $token',
    },
  );

  return response;
}

3. 验证 JWT 有效性

在服务器端验证 JWT 的有效性。服务器通常会检查 JWT 的签名、有效期等信息。如果 JWT 无效，服务器会返回 401 Unauthorized 错误。

4. 刷新 JWT

如果 JWT 过期，你需要刷新它。通常，服务器会提供一个刷新令牌的接口。

Future<void> refreshToken() async {
  final refreshToken = await getRefreshToken();
  
  final response = await http.post(
    Uri.parse('https://your-api.com/refresh-token'),
    body: {
      'refresh_token': refreshToken,
    },
  );

  if (response.statusCode == 200) {
    final newToken = jsonDecode(response.body)['token'];
    await saveToken(newToken);
  } else {
    // Handle token refresh failure
  }
}

5. 处理未授权错误

如果 API 请求返回 401 错误，通常意味着 JWT 已过期或无效。此时，你可以尝试刷新令牌并重新发起请求。

Future<http.Response> fetchProtectedDataWithRetry() async {
  var response = await fetchProtectedData();
  
  if (response.statusCode == 401) {
    await refreshToken();
    response = await fetchProtectedData();
  }

  return response;
}

通过这些步骤，你可以在 Flutter 应用中实现 JWT 验证，保护 API 请求的安全性。

回到顶部