
Flutter网络请求高级技巧1. 核心概念1.1 网络库httpFlutter官方推荐的网络库dio功能强大的第三方网络库retrofit基于Dart注解的REST客户端生成器1.2 请求方法GET获取资源POST创建资源PUT更新资源DELETE删除资源PATCH部分更新资源1.3 响应处理状态码HTTP状态码响应体服务器返回的数据错误处理网络错误、服务器错误2. 高级技巧2.1 基础网络请求// 使用http库 import package:http/http.dart as http; Futurevoid fetchData() async { try { final response await http.get(Uri.parse(https://api.example.com/data)); if (response.statusCode 200) { // 处理成功响应 print(Response: ${response.body}); } else { // 处理错误响应 print(Error: ${response.statusCode}); } } catch (e) { // 处理网络错误 print(Network error: $e); } } // 使用dio库 import package:dio/dio.dart; Futurevoid fetchDataWithDio() async { try { final dio Dio(); final response await dio.get(https://api.example.com/data); // 处理成功响应 print(Response: ${response.data}); } catch (e) { // 处理错误 print(Error: $e); } }2.2 拦截器// 创建dio实例 final dio Dio(); // 添加请求拦截器 dio.interceptors.add(InterceptorsWrapper( onRequest: (options, handler) { // 在发送请求之前做一些处理 print(Request: ${options.uri}); // 添加认证token options.headers[Authorization] Bearer your-token; return handler.next(options); }, onResponse: (response, handler) { // 在收到响应后做一些处理 print(Response: ${response.statusCode}); return handler.next(response); }, onError: (DioException e, handler) { // 处理错误 print(Error: ${e.message}); return handler.next(e); }, )); // 使用带拦截器的dio实例 Futurevoid fetchData() async { try { final response await dio.get(https://api.example.com/data); print(Response: ${response.data}); } catch (e) { print(Error: $e); } }2.3 错误处理Futurevoid fetchData() async { try { final dio Dio(); final response await dio.get(https://api.example.com/data); print(Response: ${response.data}); } on DioException catch (e) { if (e.response ! null) { // 服务器返回错误状态码 print(Server error: ${e.response?.statusCode}); print(Error data: ${e.response?.data}); } else { // 网络错误 print(Network error: ${e.message}); } } catch (e) { // 其他错误 print(Error: $e); } } // 自定义错误处理类 class ApiError { final int statusCode; final String message; ApiError(this.statusCode, this.message); factory ApiError.fromDioException(DioException e) { if (e.response ! null) { return ApiError( e.response!.statusCode!, e.response!.data[message] ?? Server error, ); } else { return ApiError(0, e.message ?? Network error); } } } Futurevoid fetchDataWithCustomError() async { try { final dio Dio(); final response await dio.get(https://api.example.com/data); print(Response: ${response.data}); } on DioException catch (e) { final error ApiError.fromDioException(e); print(Error: ${error.statusCode} - ${error.message}); } }2.4 缓存// 使用dio的缓存拦截器 import package:dio_cache_interceptor/dio_cache_interceptor.dart; import package:dio_cache_interceptor_hive_store/dio_cache_interceptor_hive_store.dart; void setupDio() { // 缓存配置 final cacheOptions CacheOptions( store: HiveCacheStore(.cache), policy: CachePolicy.request, // 请求时缓存 maxStale: Duration(days: 7), // 缓存最大过期时间 priority: CachePriority.normal, ); // 创建dio实例 final dio Dio()..interceptors.add(DioCacheInterceptor(options: cacheOptions)); } // 手动缓存 class ApiService { final Dio _dio; final MapString, Response _cache {}; ApiService(this._dio); FutureResponse get(String url) async { // 检查缓存 if (_cache.containsKey(url)) { return _cache[url]!; } // 发起请求 final response await _dio.get(url); // 缓存响应 _cache[url] response; return response; } void clearCache() { _cache.clear(); } }2.5 文件上传和下载// 文件上传 Futurevoid uploadFile() async { final dio Dio(); // 单文件上传 final formData FormData.fromMap({ name: John Doe, file: await MultipartFile.fromFile(path/to/file.jpg, filename: photo.jpg), }); try { final response await dio.post(https://api.example.com/upload, data: formData); print(Upload successful: ${response.data}); } catch (e) { print(Upload error: $e); } } // 多文件上传 Futurevoid uploadMultipleFiles() async { final dio Dio(); final formData FormData.fromMap({ name: John Doe, files: [ await MultipartFile.fromFile(path/to/file1.jpg, filename: photo1.jpg), await MultipartFile.fromFile(path/to/file2.jpg, filename: photo2.jpg), ], }); try { final response await dio.post(https://api.example.com/upload-multiple, data: formData); print(Upload successful: ${response.data}); } catch (e) { print(Upload error: $e); } } // 文件下载 Futurevoid downloadFile() async { final dio Dio(); try { final response await dio.download( https://api.example.com/file, path/to/save/file.pdf, onReceiveProgress: (count, total) { print(Download progress: ${(count / total * 100).toStringAsFixed(0)}%); }, ); print(Download successful); } catch (e) { print(Download error: $e); } }2.6 网络状态管理// 检查网络状态 import package:connectivity_plus/connectivity_plus.dart; Futurevoid checkNetworkStatus() async { final connectivityResult await (Connectivity().checkConnectivity()); if (connectivityResult ConnectivityResult.none) { print(No internet connection); } else if (connectivityResult ConnectivityResult.mobile) { print(Connected to mobile network); } else if (connectivityResult ConnectivityResult.wifi) { print(Connected to wifi); } } // 监听网络状态变化 void listenToNetworkChanges() { Connectivity().onConnectivityChanged.listen((ConnectivityResult result) { if (result ConnectivityResult.none) { print(No internet connection); } else if (result ConnectivityResult.mobile) { print(Connected to mobile network); } else if (result ConnectivityResult.wifi) { print(Connected to wifi); } }); } // 网络状态管理服务 class NetworkService { final Connectivity _connectivity Connectivity(); StreamConnectivityResult get onNetworkChange _connectivity.onConnectivityChanged; Futurebool isConnected() async { final result await _connectivity.checkConnectivity(); return result ! ConnectivityResult.none; } }3. 最佳实践3.1 代码组织服务层将网络请求封装为服务模型层定义数据模型存储层处理缓存和本地存储工具类提取通用的网络工具函数3.2 性能优化缓存合理使用缓存减少网络请求批量请求合并多个请求减少网络开销压缩使用gzip压缩减少数据传输量超时设置合理设置请求超时时间重试机制实现请求重试逻辑3.3 安全性HTTPS使用HTTPS协议认证使用安全的认证方式加密加密敏感数据防注入防止SQL注入等攻击CORS正确配置CORS3.4 可测试性模拟网络请求使用mock数据进行测试单元测试测试网络服务的各个部分集成测试测试网络请求的完整流程4. 实际应用4.1 电商应用网络服务// 产品服务 class ProductService { final Dio _dio; ProductService(this._dio); FutureListProduct getProducts() async { try { final response await _dio.get(/products); final Listdynamic data response.data; return data.map((item) Product.fromJson(item)).toList(); } catch (e) { print(Error fetching products: $e); throw e; } } FutureProduct getProductById(String id) async { try { final response await _dio.get(/products/$id); return Product.fromJson(response.data); } catch (e) { print(Error fetching product: $e); throw e; } } FutureProduct createProduct(Product product) async { try { final response await _dio.post(/products, data: product.toJson()); return Product.fromJson(response.data); } catch (e) { print(Error creating product: $e); throw e; } } FutureProduct updateProduct(String id, Product product) async { try { final response await _dio.put(/products/$id, data: product.toJson()); return Product.fromJson(response.data); } catch (e) { print(Error updating product: $e); throw e; } } Futurevoid deleteProduct(String id) async { try { await _dio.delete(/products/$id); } catch (e) { print(Error deleting product: $e); throw e; } } } // 购物车服务 class CartService { final Dio _dio; CartService(this._dio); FutureListCartItem getCart() async { try { final response await _dio.get(/cart); final Listdynamic data response.data; return data.map((item) CartItem.fromJson(item)).toList(); } catch (e) { print(Error fetching cart: $e); throw e; } } FutureCartItem addToCart(String productId, int quantity) async { try { final response await _dio.post(/cart, data: { product_id: productId, quantity: quantity, }); return CartItem.fromJson(response.data); } catch (e) { print(Error adding to cart: $e); throw e; } } Futurevoid removeFromCart(String itemId) async { try { await _dio.delete(/cart/$itemId); } catch (e) { print(Error removing from cart: $e); throw e; } } FutureCartItem updateQuantity(String itemId, int quantity) async { try { final response await _dio.put(/cart/$itemId, data: { quantity: quantity, }); return CartItem.fromJson(response.data); } catch (e) { print(Error updating quantity: $e); throw e; } } }4.2 社交应用网络服务// 用户服务 class UserService { final Dio _dio; UserService(this._dio); FutureUser login(String email, String password) async { try { final response await _dio.post(/auth/login, data: { email: email, password: password, }); // 存储token final token response.data[token]; _dio.options.headers[Authorization] Bearer $token; return User.fromJson(response.data[user]); } catch (e) { print(Error logging in: $e); throw e; } } FutureUser register(User user) async { try { final response await _dio.post(/auth/register, data: user.toJson()); return User.fromJson(response.data[user]); } catch (e) { print(Error registering: $e); throw e; } } FutureUser getProfile() async { try { final response await _dio.get(/users/profile); return User.fromJson(response.data); } catch (e) { print(Error fetching profile: $e); throw e; } } FutureUser updateProfile(User user) async { try { final response await _dio.put(/users/profile, data: user.toJson()); return User.fromJson(response.data); } catch (e) { print(Error updating profile: $e); throw e; } } } // 帖子服务 class PostService { final Dio _dio; PostService(this._dio); FutureListPost getPosts() async { try { final response await _dio.get(/posts); final Listdynamic data response.data; return data.map((item) Post.fromJson(item)).toList(); } catch (e) { print(Error fetching posts: $e); throw e; } } FuturePost createPost(Post post) async { try { final response await _dio.post(/posts, data: post.toJson()); return Post.fromJson(response.data); } catch (e) { print(Error creating post: $e); throw e; } } FuturePost updatePost(String id, Post post) async { try { final response await _dio.put(/posts/$id, data: post.toJson()); return Post.fromJson(response.data); } catch (e) { print(Error updating post: $e); throw e; } } Futurevoid deletePost(String id) async { try { await _dio.delete(/posts/$id); } catch (e) { print(Error deleting post: $e); throw e; } } Futurevoid likePost(String id) async { try { await _dio.post(/posts/$id/like); } catch (e) { print(Error liking post: $e); throw e; } } Futurevoid unlikePost(String id) async { try { await _dio.delete(/posts/$id/like); } catch (e) { print(Error unliking post: $e); throw e; } } } // 评论服务 class CommentService { final Dio _dio; CommentService(this._dio); FutureListComment getComments(String postId) async { try { final response await _dio.get(/posts/$postId/comments); final Listdynamic data response.data; return data.map((item) Comment.fromJson(item)).toList(); } catch (e) { print(Error fetching comments: $e); throw e; } } FutureComment createComment(String postId, String content) async { try { final response await _dio.post(/posts/$postId/comments, data: { content: content, }); return Comment.fromJson(response.data); } catch (e) { print(Error creating comment: $e); throw e; } } Futurevoid deleteComment(String commentId) async { try { await _dio.delete(/comments/$commentId); } catch (e) { print(Error deleting comment: $e); throw e; } } }5. 总结Flutter网络请求的高级技巧包括使用不同的网络库http、dio、retrofit实现拦截器和错误处理使用缓存和文件上传下载管理网络状态组织清晰的网络服务架构通过掌握这些技巧你可以创建出更加可靠、高效的Flutter应用提升用户体验和应用的性能。