面试题：Flutter http插件封装中如何实现请求拦截与响应拦截

Question

在Flutter对http插件封装的基础上，阐述如何添加请求拦截器和响应拦截器，以统一处理如添加请求头、错误处理等操作，给出具体实现思路及关键代码片段。

Answer 1

实现思路

1. 请求拦截器：在发送HTTP请求之前，拦截请求并添加需要的请求头或进行其他预处理操作。
2. 响应拦截器：在收到HTTP响应之后，拦截响应并进行错误处理或其他后处理操作。

关键代码片段

1. 初始化HTTP客户端并添加拦截器

   import 'package:dio/dio.dart';
   
   void main() async {
     Dio dio = Dio();
   
     // 添加请求拦截器
     dio.interceptors.add(InterceptorsWrapper(
       onRequest: (Options options, RequestInterceptorHandler handler) {
         // 添加请求头
         options.headers['Authorization'] = 'Bearer your_token';
         return handler.next(options);
       },
     ));
   
     // 添加响应拦截器
     dio.interceptors.add(InterceptorsWrapper(
       onResponse: (Response response, ResponseInterceptorHandler handler) {
         if (response.statusCode! >= 400) {
           // 处理错误
           throw DioError(requestOptions: response.requestOptions, error: 'Custom error handling');
         }
         return handler.next(response);
       },
     ));
   
     try {
       Response response = await dio.get('https://example.com/api/data');
       print(response.data);
     } catch (e) {
       print('Error: $e');
     }
   }
   

2. 解释
   • 请求拦截器：onRequest 方法会在每次请求发送前被调用。在这里我们给 options.headers 添加了 Authorization 头信息，然后通过 handler.next(options) 继续发送请求。
   • 响应拦截器：onResponse 方法会在每次收到响应后被调用。如果 response.statusCode 大于等于400，我们抛出一个自定义的 DioError 来处理错误，否则通过 handler.next(response) 继续处理响应。

以上代码基于 dio 库，它是Flutter中常用的HTTP请求库，可用于在Flutter项目中方便地实现请求和响应拦截器。