Flutter通信接口插件sim_api的使用

SimApi 是一个强大的库，用于在 Dart 中模拟 API 响应。它允许开发者创建用于测试和开发目的的模拟 API，而无需实际的后端服务器。

功能

• 模拟 HTTP 方法：GET、POST、PUT、PATCH、DELETE
• 可自定义的响应延迟以模仿网络延迟
• 支持路由参数和查询参数
• 复杂场景的自定义路由处理程序
• 简单的数据填充和管理
• 灵活的路由注册

安装

将以下依赖添加到你的 pubspec.yaml 文件中：

dependencies:
  sim_api: ^0.0.5

然后运行：

flutter pub get

使用

基本设置

import 'package:sim_api/sim_api.dart';

void main() {
  final api = SimApi<int>();

  // 注册路由
  api.registerRoute('/users');
  api.registerRoute('/users', method: SimApiHttpMethod.get, haveRouteParameters: true);

  // 填充一些数据
  api.seedData('/users', {
    1: {'id': 1, 'name': 'Alice'},
    2: {'id': 2, 'name': 'Bob'},
  });

  // 使用 API
  api.get(Uri.parse('/users/1')).then((response) {
    print(response.body);
  });
}

自定义路由处理程序

simApi.registerRoute(
      '/custom',
      method: SimApiHttpMethod.get,
      handler: (
        url, {
        body,
        headers,
        required delete,
        required get,
        required patch,
        required post,
        required put,
      }) async {
        return SimApiHttpResponse.ok({'message': 'custom route'});
      },
    );

模拟网络延迟

// 设置全局延迟
api.delay = 1000; // 1 秒延迟

// 或者使用构造函数
final api = SimApi(defaultDelay: 1000);

示例代码

以下是一个完整的示例代码，展示了如何使用 sim_api 插件。

import 'package:flutter/material.dart';
import 'package:sim_api/models/sim_api_http_method.dart';
import 'package:sim_api/sim_api.dart';

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

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: const MyHomePage(title: 'SimApi 测试'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});

  final String title;

  [@override](/user/override)
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  final _apiClient = SimApi<String>();
  List<ItemResponse> _data = [];
  final _newItemController = TextEditingController();

  [@override](/user/override)
  void initState() {
    super.initState();
    _seedData();
    _fetchData();
  }

  void _seedData() {
    _apiClient.registerRoute('/items');
    _apiClient.registerRoute(
      '/items',
      method: SimApiHttpMethod.patch,
      haveRouteParameters: true,
    );
    _apiClient.registerRoute(
      '/items',
      method: SimApiHttpMethod.delete,
      haveRouteParameters: true,
    );
    _apiClient.seedData('/items', {
      '1': ItemResponse(id: '1', name: '项目 1').toJson(),
      '2': ItemResponse(id: '2', name: '项目 2').toJson(),
      '3': ItemResponse(id: '3', name: '项目 3').toJson(),
    });
  }

  Future<void> _fetchData() async {
    final response = await _apiClient.get(Uri.parse('/items'));
    if (response.statusCode == 200) {
      setState(() {
        _data = (response.body as List)
            .map((e) => ItemResponse.fromJson(e))
            .toList();
      });
    }
  }

  void _createItem() async {
    final newItem = ItemRequest(name: _newItemController.text);
    await _apiClient.post(Uri.parse('/items'), body: newItem.toJson());
    _newItemController.clear();
    _fetchData();
  }

  void _updateItem(String id) async {
    final updatedItem = ItemRequest(name: _newItemController.text);
    await _apiClient.patch(Uri.parse('/items/$id'), body: updatedItem.toJson());
    _newItemController.clear();
    _fetchData();
  }

  void _deleteItem(String id) async {
    await _apiClient.delete(Uri.parse('/items/$id'));
    _fetchData();
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('SimApi 测试'),
      ),
      body: Padding(
        padding: const EdgeInsets.all(16.0),
        child: Column(
          children: <Widget>[
            TextField(
              controller: _newItemController,
              decoration: const InputDecoration(
                labelText: '新项目名称',
                border: OutlineInputBorder(),
              ),
            ),
            const SizedBox(height: 10),
            ElevatedButton(
              onPressed: _createItem,
              child: const Text('创建项目'),
            ),
            const SizedBox(height: 20),
            Expanded(
              child: ListView.builder(
                itemCount: _data.length,
                itemBuilder: (context, index) {
                  final item = _data[index];
                  final id = item.id;
                  return Card(
                    margin: const EdgeInsets.symmetric(vertical: 8.0),
                    elevation: 4,
                    child: ListTile(
                      contentPadding: const EdgeInsets.all(16.0),
                      title: Text(
                        item.name,
                        style: Theme.of(context).textTheme.headlineSmall,
                      ),
                      trailing: Row(
                        mainAxisSize: MainAxisSize.min,
                        children: <Widget>[
                          IconButton(
                            icon: const Icon(Icons.edit),
                            onPressed: () => _updateItem(id),
                          ),
                          IconButton(
                            icon: const Icon(Icons.delete),
                            onPressed: () => _deleteItem(id),
                          ),
                        ],
                      ),
                    ),
                  );
                },
              ),
            ),
          ],
        ),
      ),
    );
  }
}

class ItemRequest {
  final String name;

  ItemRequest({required this.name});

  Map<String, dynamic> toJson() {
    return {'name': name};
  }
}

class ItemResponse {
  final String id;
  final String name;

  ItemResponse({required this.id, required this.name});

  Map<String, dynamic> toJson() {
    return {'id': id, 'name': name};
  }

  factory ItemResponse.fromJson(Map<String, dynamic> json) {
    return ItemResponse(
      id: json['id'] as String,
      name: json['name'] as String,
    );
  }
}