Flutter中如何使用Dio通过Basic Auth发起POST请求获取Token

实现步骤 #

• 第一步：引入Dio依赖
  在项目pubspec.yaml的dependencies节点下添加依赖：

dependencies:
  flutter:
    sdk: flutter
  dio: ^5.4.0 # 可替换为最新稳定版

保存后执行命令flutter pub get完成依赖安装。

• 第二步：编写请求逻辑
  Basic Auth的核心是在请求头中携带格式为Authorization: Basic base64(用户名:密码)的认证字段，单次请求携带认证信息可直接参考如下代码：

// 必须导入的依赖
import 'package:dio/dio.dart';
import 'dart:convert';

// 建议全局维护Dio单例，避免重复创建实例
final Dio dio = Dio(BaseOptions(
  baseUrl: "https://你的接口域名",
  connectTimeout: const Duration(seconds: 10),
  receiveTimeout: const Duration(seconds: 10),
  // 如果接口要求表单提交，可放开下面这行配置
  // contentType: Headers.formUrlEncodedContentType,
));

/// 调用认证接口获取Token
/// [username] Basic认证用户名
/// [password] Basic认证密码
Future<String?> getRequestToken(String username, String password) async {
  try {
    // 拼接Basic认证头
    final basicAuthHeader = "Basic ${base64Encode(utf8.encode('$username:$password'))}";
    
    final response = await dio.post(
      "/你的Token接口路径",
      options: Options(
        headers: {
          "Authorization": basicAuthHeader,
        },
      ),
      // 接口要求的其他POST参数，根据实际文档补充
      data: {
        // 例："grant_type": "client_credentials"
      },
    );

    // 按接口返回结构解析Token，对应实际响应格式取对应字段即可
    if (response.statusCode == 200 && response.data is Map) {
      // 字段名根据实际返回调整，常见字段名有token、access_token
      return response.data["token"]?.toString();
    }
  } on DioException catch (e) {
    // 错误捕获
    print("接口请求异常: ${e.message}");
    if (e.response != null) {
      print("响应状态码: ${e.response?.statusCode}, 响应内容: ${e.response?.data}");
    }
  }
  return null;
}

可选优化：全局配置Basic Auth #

如果项目中多个接口都需要携带Basic Auth，不需要每个请求都单独加请求头，通过Dio拦截器统一注入即可：

// 在Dio实例初始化后添加拦截器
dio.interceptors.add(InterceptorsWrapper(
  onRequest: (options, handler) async {
    const username = "你的统一认证账号";
    const password = "你的统一认证密钥";
    options.headers["Authorization"] = "Basic ${base64Encode(utf8.encode('$username:$password'))}";
    // 继续发起请求
    handler.next(options);
  },
));

常见踩坑说明 #

• 拼接认证字段时，用户名和密码中间的冒号不能省略，不要加多余空格，否则会导致401未授权错误
• 如果接口返回格式不是JSON，记得在Options中设置对应的responseType
• 获取到的Token建议通过shared_preferences等本地存储方案持久化，后续需要Token鉴权的接口，在请求头携带Authorization: Bearer 你的Token值即可

内容的提问来源于stack exchange，提问作者SaDev