Flutter动态用户认证及Token存入SharedPreferences问题

1. 修复getToken方法，正确解析API返回的Token #

原来的方法硬编码了用户名密码，还错误处理了响应体，现在改成使用传入的登录参数，并通过Auth类正确解析Token：

Future<String?> getToken(String password, String login) async {
  Map<String, String> headers = {
    'Content-Type': 'application/json',
    'accept': '*/*'
  };
  final body = {
    'username': login, // 使用用户输入的用户名
    'password': password, // 使用用户输入的密码
  };
  var response = await http.post(
    Uri.parse("http://mylink/login"),
    headers: headers,
    body: jsonEncode(body),
  );
  if (response.statusCode == 200) {
    // 用Auth类解析响应体，直接提取token
    Auth auth = authFromJson(response.body);
    return auth.token;
  }
  return null;
}

2. 调整登录逻辑，存入带Bearer前缀的完整Token #

登录成功后直接给Token加上Bearer 前缀再存入SharedPreferences，避免后续重复拼接：

ElevatedButton(
  onPressed: () async {
    var username = _loginController.text;
    var password = _passwordController.text;
    var jwt = await ProviderService().getToken(password, username);
    if (jwt != null) {
      // 拼接Bearer前缀后存入
      await SharedPreferenceService().setToken("Bearer $jwt");
      Navigator.pushNamed(context, '/mainPageAdmin');
    } else {
      displayDialog(context);
    }
  },
)

3. 重构SharedPreferenceService，移除固定Token实现动态获取 #

删掉固定的tokens变量，让loginWithToken直接从SharedPreferences读取登录时存入的动态Token：

class SharedPreferenceService {
  SharedPreferences? _prefs;

  // 初始化SharedPreferences实例
  Future<bool> initSharedPreferences() async {
    try {
      _prefs = await SharedPreferences.getInstance();
      return true;
    } catch (e) {
      print("shared preferences error : $e");
      return false;
    }
  }

  // 存入Token
  Future<void> setToken(String token) async {
    if (_prefs == null) await initSharedPreferences();
    await _prefs?.setString('token', token);
  }

  // 清除Token
  Future<void> clearToken() async {
    if (_prefs == null) await initSharedPreferences();
    await _prefs?.clear();
  }

  // 获取Token的快捷getter
  Future<String> get token async {
    if (_prefs == null) await initSharedPreferences();
    return _prefs?.getString('token') ?? '';
  }

  // 适配HttpConnectionOptions的方法，直接返回存储的动态Token
  Future<String> loginWithToken() async {
    bool isInitialized = await initSharedPreferences();
    if (isInitialized) {
      return await token;
    }
    return '';
  }
}

4. 验证HttpConnectionOptions配置 #

现在loginWithToken会动态读取登录后存入的Token，直接适配原配置即可：

final httpConnectionOptions = HttpConnectionOptions(
  accessTokenFactory: () => SharedPreferenceService().loginWithToken(),
);

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