Flutter简化API调用插件easy_api的使用

Flutter简化API调用插件easy_api的使用

最佳且简单的集成REST API的方式🚀

easy_api 的主要功能:

  1. 执行HTTP请求🚀
  2. 处理HTTP异常🚀
  3. 数据模型处理🚀

安装

pubspec.yaml 文件中添加依赖项:

dependencies:
  easy_api: ^<最新版本>

使用

a. 执行HTTP请求🚀

0. 将你的网络类扩展为 EasyApiHandler

class MyNetworkClass extends EasyApiHelper {

  // 默认构造函数需要提供。

  MyNetworkClass({required String baseApiUrl})
      : super(baseApiUrl: "http://localhost:5000/", headers: "YOUR_CUSTOM_HEADERS");

   // 注意:headers 参数是可选的。如果 headers 为 null,easy_api 将使用默认 headers:
   
     {
       'Content-type': 'application/json',
       'Accept': 'application/json',
       'Access-Control-Allow-Origin": "*"
     };
      
}

1. 使用 sendGetRequest 函数发送GET请求

class MyNetworkClass extends EasyApiHelper {

  MyNetworkClass({required String baseApiUrl})
      : super(baseApiUrl: "http://localhost:5000/");
      
  Future fetchTask() async {
    return sendGetRequest(route: "todo/fetch");
  }
  
  Future fetchTaskWithParameters(int task_id) async {
    return sendGetRequest(route: "todo/fetch_by_id", params : task_id);
  }
  
}

2. 使用 sendPostRequest 函数发送POST请求

class MyNetworkClass extends EasyApiHelper {

  MyNetworkClass({required String baseApiUrl})
      : super(baseApiUrl: "http://localhost:5000/");
      
  Future createTask({
    required String taskTitle,
    required String taskDescription,
  }) async {
    return sendPostRequest(route: "todo/create", body: {
      "task_title": taskTitle,
      "task_description": taskDescription,
    });
  }
  
}

3. 使用 sendDeleteRequest 函数发送DELETE请求

class MyNetworkClass extends EasyApiHelper {

  MyNetworkClass({required String baseApiUrl})
      : super(baseApiUrl: "http://localhost:5000/");
      
  Future deleteTask({
    required int taskId
  }) async {
    return sendDeleteRequest(route: "todo/delete", // 必须参数
            params : taskId.toString(), // 必须参数
            isParams : true, // 必须参数
            body : {SOME_BODY} // 可选参数
         ); 
  }
  
}

4. 使用 sendPutRequest 函数发送PUT请求

class MyNetworkClass extends EasyApiHelper {

  MyNetworkClass({required String baseApiUrl})
      : super(baseApiUrl: "http://localhost:5000/");
      
  Future updateTask({
    required int taskId,
    required String taskTitle
  }) async {
    
    return sendPutRequest(
          route: "todo/update", // 必须参数
          body : { "taskId" : taskId, "taskTitle" : taskTitle} // 必须参数
          );
  }
  
}

b. 处理HTTP异常🚀

EasyException 类将处理所有异常。

Future updateTask({
    required int taskId,
    required String taskTitle
  }) async {
    
   try{
   
     return sendPutRequest(
          route: "todo/update",
          body : { "taskId" : taskId, "taskTitle" : taskTitle} 
       );
     }
     on EasyException catch (exception){
     
     debugPrint(exception.message)
     
     // 此外,向用户显示Snackbar
     
     }
  }

c. 数据模型处理🚀

扩展你的仓库类为 EasyModelWrapper 并查看轻松的魔法🚀

EasyModelWrapper 提供了三个函数,可以用来从数据模型中解析(编码/解码)数据。

注意:在这个版本中,数据模型必须有 statusdata 这两个主要参数作为输出。否则你必须自己处理属性名称。

演示模型类:

class Tasks {
  Tasks({
    required this.status, // 必须的
    required this.data, // 必须的
  });
  late final bool status;
  late final List<TasksData> data;

  Tasks.fromJson(Map<String, dynamic> json) {
    status = json['status'];
    data = List.from(json['data']).map((e) => TasksData.fromJson(e)).toList();
  }

  Map<String, dynamic> toJson() {
    final _data = <String, dynamic>{};
    _data['status'] = status;
    _data['data'] = data.map((e) => e.toJson()).toList();
    return _data;
  }
}

class TasksData {
  TasksData({
    required this.taskId,
    required this.taskTitle,
    required this.taskDescription,
  });
  late final int taskId;
  late final String taskTitle;
  late final String taskDescription;

  TasksData.fromJson(Map<String, dynamic> json) {
    taskId = json['task_id'];
    taskTitle = json['task_title'];
    taskDescription = json['task_description'];
  }

  Map<String, dynamic> toJson() {
    final _data = <String, dynamic>{};
    _data['task_id'] = taskId;
    _data['task_title'] = taskTitle;
    _data['task_description'] = taskDescription;

    return _data;
  }
}

EasyModelWrapper 的使用:

class TaskRepository extends EasyModelWrapper {

  final TaskNetwork taskNetwork;
  TaskRepository({required this.taskNetwork});

  Future createTask({
    required String taskTitle,
    required String taskDescription,
    required String taskScheduledAt,
    required List<int> taskCategoryIds,
  }) async {
    return decoder(
        response: await taskNetwork.createTask(
            taskTitle: taskTitle, taskDescription: taskDescription));
  }
  
  Future fetchSimpleTasks() async {
    return modelDecoder(
        jsonFormat: Tasks.fromJson,
        parentTypeClass: Tasks,
        response: await taskNetwork.fetchTask());
  }

  Future fetchNestedTasks() async {
    return nestedModelDecoder(
        jsonFormat: Tasks.fromJson,
        parentTypeClass: Tasks,
        childTypeClass: TasksData,
        response: await taskNetwork.fetchTask());
  }
}

更多关于Flutter简化API调用插件easy_api的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter简化API调用插件easy_api的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


easy_api 是一个用于简化 Flutter 应用中 API 调用的插件。它可以帮助开发者更轻松地处理网络请求、错误处理和响应解析。下面是如何使用 easy_api 插件的基本步骤。

1. 添加依赖

首先,在 pubspec.yaml 文件中添加 easy_api 依赖:

dependencies:
  flutter:
    sdk: flutter
  easy_api: ^1.0.0  # 请检查最新版本

然后运行 flutter pub get 来安装依赖。

2. 创建 API 服务

接下来,创建一个 API 服务类,用于封装所有的 API 调用。

import 'package:easy_api/easy_api.dart';

class ApiService {
  final EasyApi _api = EasyApi(baseUrl: 'https://jsonplaceholder.typicode.com');

  Future<List<dynamic>> getPosts() async {
    final response = await _api.get('/posts');
    return response.data;
  }

  Future<Map<String, dynamic>> createPost(Map<String, dynamic> postData) async {
    final response = await _api.post('/posts', data: postData);
    return response.data;
  }
}

3. 在 UI 中使用 API 服务

现在你可以在 Flutter 的 UI 中使用这个 API 服务了。

import 'package:flutter/material.dart';
import 'api_service.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: HomeScreen(),
    );
  }
}

class HomeScreen extends StatefulWidget {
  @override
  _HomeScreenState createState() => _HomeScreenState();
}

class _HomeScreenState extends State<HomeScreen> {
  final ApiService _apiService = ApiService();
  List<dynamic> _posts = [];

  @override
  void initState() {
    super.initState();
    _fetchPosts();
  }

  Future<void> _fetchPosts() async {
    try {
      final posts = await _apiService.getPosts();
      setState(() {
        _posts = posts;
      });
    } catch (e) {
      print('Error fetching posts: $e');
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Posts'),
      ),
      body: ListView.builder(
        itemCount: _posts.length,
        itemBuilder: (context, index) {
          final post = _posts[index];
          return ListTile(
            title: Text(post['title']),
            subtitle: Text(post['body']),
          );
        },
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () async {
          final newPost = {
            'title': 'New Post',
            'body': 'This is a new post created using EasyApi',
            'userId': 1,
          };
          await _apiService.createPost(newPost);
          _fetchPosts(); // Refresh the list after creating a new post
        },
        child: Icon(Icons.add),
      ),
    );
  }
}

4. 处理错误

EasyApi 会自动处理 HTTP 错误,你可以通过 response.error 来检查是否有错误发生。

final response = await _api.get('/posts');
if (response.hasError) {
  print('Error: ${response.error}');
} else {
  print('Data: ${response.data}');
}

5. 其他功能

EasyApi 还支持其他功能,如设置请求头、超时时间、拦截器等。你可以根据需要进一步配置。

final _api = EasyApi(
  baseUrl: 'https://jsonplaceholder.typicode.com',
  headers: {'Authorization': 'Bearer token'},
  timeout: Duration(seconds: 10),
);

_api.interceptors.add(
  (request) {
    print('Request: ${request.method} ${request.url}');
    return request;
  },
);
回到顶部