flutetr dio 拦截器实现 token 失效刷新

网上查了一圈，没发现有人分享，一路吃坑吃过来，终于实现了自动刷新 token 并重发请求的拦截器。

然后就想着分享一下，也许分享出来可以帮助小伙伴快速实现自己的token刷新机制，关于Dio的拦截器，不过多介绍，直接前往 Dio 的文档，即可找到拦截器的介绍。我只说一下使用上需要注意的点，以及我写的代码。不多，也就70行。

拦截器文档传送门：Dio中文文档

先上拦截器类的整体代码，然后简单讲解一下

import 'dart:async';

import 'package:college_circle/data/events/login_Invalid_event.dart';
import 'package:college_circle/data/models/auth.dart';
import 'package:college_circle/data/net/dio_util.dart';
import 'package:college_circle/util/config.dart';
import 'package:college_circle/util/event_manager.dart';
import 'package:dio/dio.dart';

class RefreshTokenInterceptor extends Interceptor {
  @override
  onError(DioError err) async {
    if (err.response != null && err.response.statusCode == 401 && Auth.isLogin) {
      Dio dio = DioUtil().getDio(); //获取dio单例
      dio.lock();
      Auth.token = await getToken(); //获取新token
      Auth.save();
      DioUtil().setToken(Auth.token);
      dio.unlock();

      var request = err.response.request; //千万不要调用 err.request
      request.headers['Authorization'] = 'JWT ${Auth.token}'; //这里要单独修改之前请求里的token请求头为最新的token。
      try {
        var response = await dio.request(request.path,
            data: request.data,
            queryParameters: request.queryParameters,
            cancelToken: request.cancelToken,
            options: request,
            onReceiveProgress:request.onReceiveProgress //TODO 差一个onSendProgress
            );
        return response;
      } on DioError catch (e) {
        return e;
      }
    }
    super.onError(err);
  }

  ///获取新token
  Future<String> getToken() async {
    String token = Auth.token; //获取当前token
    Dio ndio = DioUtil.createNewDio(); //创建新dio实例
    ndio.options.baseUrl = AppConfig.DOMAIN_NAME; //配置baseUrl
    ndio.options.headers['Authorization'] = 'JWT ${token}'; //设置当前token
    try {
      var response = await ndio.get('/auth/fresh');
      token = response.data['data']['access_token']; //获取返回的新token
      print('newToken:$token');
    } on DioError catch (e) {
      if (e.response == null) {
        print('DioError:${e.message}');
      } else {
        if (e.response.statusCode == 422) {
          print('422Error:${e.response.data['msg']}');
          //422状态码代表异地登录，token失效，发送登录失效事件，以便app弹出登录页面
          EventManager.get(EventGroup.app).fire(LoginInvalidEvent());
        }
      }
    }
    return token;
  }
}

这里分成两个函数讲解：

getToken

我们后端的 token 验证是检查请求头里的 Authorization 字段。然后能用到期的 token 直接请求新的 token，然后再来看 getToken 函数，这是个异步函数，很简单，就是拿到当前的 token，然后创建一个新的 dio 对象（这里注意一定要创建新的 dio 对象，不要用添加了拦截器的那个 dio 对象，不然会发生死锁，这一点官方文档也有提到）。

然后用新的 dio 对象去请求新的 token，然后把新 token 返回给调用者。这里有个异常处理，处理 token 刷新失败的情况是否为异地登录，然后发送登录失效的事件，这个事件发送是用的 event_bus 插件。超级好用。

onError

这里挺麻烦的，先获取 err 对象的 response 对象，判断状态码是否为 401 ，为 401 则是 token 失效了，需要刷新。在刷新之前，要给拦截器上个锁，这里给 requestLock 给锁上，锁 requestLock 目的是为了防止更多的 401 错误，并且导致重复刷新 token。

然后调用 getToken 获取新 token 然后把新 token 保存起来，再给 DioUtil单例对象的 dio 设置上token，这个单例是平时请求用的。然后把拦截器的锁给解开，这样后面的请求就可以携带上新的token去服务器拿数据了。

接下来是容易出错的请求重发环节，这里要拿到 token 失效的那个请求。留意一段代码var request = err.response.request;

我一开始是调用的 err.request ，结果后续用到 request 变量的地方就报错了，空对象错误，折腾了一会儿才发现要拿到发生错误的请求要用 err.response.request

然后就是重新发起一个请求获取数据了

      try {
        var response = await dio.request(request.path,
            data: request.data,
            queryParameters: request.queryParameters,
            cancelToken: request.cancelToken,
            options: request,
            onReceiveProgress:
                request.onReceiveProgress //TODO 差一个onSendProgress
            );
        return response;
      } on DioError catch (e) {
        return e;
      }
     

这里就可以用平时发请求的 dio 对象了，最好用 try...catch 捕获错误，如果发生错误就把错误抛给下一个拦截器。

最后把请求到的结果返回一下就好了。新请求的参数都从之前获取的 request 对象里拿。

代码还有一点瑕疵，但是能正常的运行了，我觉得重发请求那一块还有优化的空间。