Flutter网络请求插件fluent_networking的使用

Flutter网络请求插件fluent_networking的使用

fluent_networking

fluent_networking 包提供了一种简单的方式来发起 HTTP 请求。

开始使用

添加依赖

在 pubspec.yaml 文件中添加 fluent_networking 依赖：

dependencies:
  fluent_networking: ^0.0.4

创建网络配置

创建一个继承自 NetworkingConfig 的类，并设置基础 URL：

class ApiConfig extends NetworkingConfig {
  [@override](/user/override)
  String get baseUrl => "https://pokeapi.co/api/v2";
}

构建模块

在应用启动时构建模块并初始化网络请求：

void main() async {
  await Fluent.build([
    NetworkingModule(config: ApiConfig()),
  ]);

  runApp(const MainApp());
}

使用它

在应用中使用网络请求插件：

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

  [@override](/user/override)
  Widget build(BuildContext context) {
    // 获取网络 API
    final networkingApi = Fluent.get<NetworkingApi>();
    // 发起 GET 请求
    final future = networkingApi.get<Map<String, dynamic>>("/pokemon");

    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text("Fluent Networking Demo"),
        ),
        body: FutureBuilder(
          future: future,
          builder: (context, snapshot) {
            return snapshot.data?.when(
                  succeeded: (data) {
                    final results = data["results"];
                    return ListView.builder(
                      itemCount: results.length,
                      itemBuilder: (context, index) {
                        return ListTile(
                          leading: Text(results[index]["name"]),
                          title: Text(results[index]["url"]),
                        );
                      },
                    );
                  },
                  failed: (data) => const Text("Failed error"),
                  error: (error) => Text(error.message ?? ""),
                ) ??
                const Center(
                  child: CircularProgressIndicator(),
                );
          },
        ),
      ),
    );
  }
}

更多关于Flutter网络请求插件fluent_networking的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter网络请求插件fluent_networking的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


fluent_networking 是一个 Flutter 插件，用于简化网络请求的处理。它提供了一种流畅的 API，使得发送 HTTP 请求变得更加简洁和易读。以下是如何使用 fluent_networking 的基本步骤：

1. 添加依赖

首先，在你的 pubspec.yaml 文件中添加 fluent_networking 依赖：

dependencies:
  flutter:
    sdk: flutter
  fluent_networking: ^1.0.0  # 请使用最新版本

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

2. 导入包

在你的 Dart 文件中导入 fluent_networking：

import 'package:fluent_networking/fluent_networking.dart';

3. 发送网络请求

使用 fluent_networking 发送网络请求非常简单。以下是一些常见的示例：

GET 请求

void fetchData() async {
  try {
    var response = await Networking.get('https://jsonplaceholder.typicode.com/posts');
    print('Response data: ${response.data}');
  } catch (e) {
    print('Error: $e');
  }
}

POST 请求

void sendData() async {
  try {
    var response = await Networking.post(
      'https://jsonplaceholder.typicode.com/posts',
      body: {
        'title': 'foo',
        'body': 'bar',
        'userId': 1,
      },
    );
    print('Response data: ${response.data}');
  } catch (e) {
    print('Error: $e');
  }
}

PUT 请求

void updateData() async {
  try {
    var response = await Networking.put(
      'https://jsonplaceholder.typicode.com/posts/1',
      body: {
        'id': 1,
        'title': 'foo',
        'body': 'bar',
        'userId': 1,
      },
    );
    print('Response data: ${response.data}');
  } catch (e) {
    print('Error: $e');
  }
}

DELETE 请求

void deleteData() async {
  try {
    var response = await Networking.delete('https://jsonplaceholder.typicode.com/posts/1');
    print('Response data: ${response.data}');
  } catch (e) {
    print('Error: $e');
  }
}

4. 处理响应

fluent_networking 的响应对象包含以下属性：

  • data: 响应的主体数据。
  • statusCode: HTTP 状态码。
  • headers: 响应头。

你可以根据需要进行处理。

5. 错误处理

fluent_networking 会自动处理一些常见的网络错误，但你可以通过 try-catch 块来捕获并处理异常。

6. 配置请求

fluent_networking 允许你配置请求头、超时时间等：

void fetchDataWithHeaders() async {
  try {
    var response = await Networking.get(
      'https://jsonplaceholder.typicode.com/posts',
      headers: {
        'Authorization': 'Bearer your_token_here',
      },
      timeout: Duration(seconds: 10),
    );
    print('Response data: ${response.data}');
  } catch (e) {
    print('Error: $e');
  }
}

7. 使用 Networking 实例

你也可以创建一个 Networking 实例来进行请求，这样可以更好地管理请求配置：

void fetchDataWithInstance() async {
  var networking = Networking(
    baseUrl: 'https://jsonplaceholder.typicode.com',
    headers: {
      'Authorization': 'Bearer your_token_here',
    },
    timeout: Duration(seconds: 10),
  );

  try {
    var response = await networking.get('/posts');
    print('Response data: ${response.data}');
  } catch (e) {
    print('Error: $e');
  }
}
回到顶部