JWT Auth与Flutter开发：如何从LoginResponseModel中获取token值？

你遇到的token为null有两种常见原因：

1. 你当前代码仅声明了LoginResponseModel类型的变量loginResponseMode，没有给它赋值为登录接口解析后的实例对象，未初始化的对象访问属性必然返回null
2. 若你已经做了解析赋值还是返回null，可打印登录接口返回的原始JSON，确认是否存在token字段，字段名是否和fromJson方法中写的json['token']完全匹配，没有拼写错误。

• 第一步：调用登录接口，拿到服务端返回的响应JSON
• 第二步：用LoginResponseModel.fromJson工厂方法解析JSON，得到实例化的模型对象
• 第三步：从解析完成的模型对象中读取token，配置到Dio的请求头中

import 'package:dio/dio.dart';

// 登录请求方法示例
Future<String?> login(String username, String password) async {
  var dio = Dio();
  try {
    // 调用登录接口
    final response = await dio.post(
      "你的登录接口地址",
      data: {
        "username": username,
        "password": password
      }
    );
    // 解析响应得到实例化的模型对象
    LoginResponseModel loginResponse = LoginResponseModel.fromJson(response.data);
    // 可将token存入持久化存储（如SharedPreferences）供全局使用
    return loginResponse.token;
  } catch (e) {
    print("登录请求出错：$e");
    return null;
  }
}

// 更新用户信息接口示例
Future updateUserInfo() async {
  // 从存储/登录方法中获取有效token
  String? token = await login("你的用户名", "你的密码");
  if (token == null) {
    print("未获取到有效token，请先完成登录");
    return;
  }
  var dio = Dio();
  // 配置请求头认证信息
  dio.options.headers["Authorization"] = "Bearer $token";
  // 发起更新用户信息的网络请求
  try {
    final updateRes = await dio.post(
      "你的更新用户信息接口地址",
      data: {
        // 你需要更新的用户参数
      }
    );
    // 处理更新后的响应结果
  } catch (e) {
    print("更新用户信息出错：$e");
  }
}

如果项目中多个接口都需要携带token，可封装全局通用的Dio实例，默认自动从持久化存储读取token添加到请求头，无需每次请求手动配置，减少重复代码。

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