Flutter网络资源获取插件network_bound_resource的使用

Flutter网络资源获取插件network_bound_resource的使用

本插件用于处理在线和离线的HTTP请求。该插件可以决定是从本地加载数据还是从服务器加载数据,并帮助您的应用在设备有互联网连接时保存离线数据并同步。

您可以执行GET、POST、PUT、DELETE或PATCH请求,并在网络连接不可用时同步数据。

已知问题

  • 如果您发送的是MultipartFile.fromFile类型的文件,则无法进行离线请求。您需要在方法参数中设置syncDataIfNoConnection: false

贡献

欢迎贡献!

您可以帮助的方式包括:

  • 报告难以实现的bug和场景
  • 报告文档中不清楚的部分
  • 更新文档/添加示例
  • 通过拉取请求实现新功能

示例代码

以下是一个完整的示例代码,展示了如何使用network_bound_resource插件来获取网络资源。

import 'dart:developer';

// 忽略对已引用包的依赖
import 'package:flutter/material.dart';
import 'package:network_bound_resource/src/domain/network_bound_resource.dart';

import 'data/remote_data_source.dart';

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

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

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

  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  late final RemoteDataSource remoteDataSource;

  @override
  void initState() {
    // 初始化远程数据源
    remoteDataSource = RemoteDataSource(NetworkBoundResource(
      'https://jsonplaceholder.typicode.com/', // API 基础URL
    ));
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            // 添加一个按钮,点击时获取数据
            ElevatedButton(
              onPressed: () async {
                // 获取数据
                final posts = await remoteDataSource.getPosts();
                // 记录获取到的数据
                log(posts.toString());
              },
              child: const Text('Get posts')
            )
          ],
        ),
      ),
    );
  }
}

说明

  1. 导入必要的库

    import 'dart:log';
    import 'package:flutter/material.dart';
    import 'package:network_bound_resource/src/domain/network_bound_resource.dart';
    import 'data/remote_data_source.dart';
    
  2. 初始化远程数据源

    remoteDataSource = RemoteDataSource(NetworkBoundResource(
      'https://jsonplaceholder.typicode.com/', // API 基础URL
    ));
    
  3. 创建按钮以触发数据获取

    ElevatedButton(
      onPressed: () async {
        final posts = await remoteDataSource.getPosts();
        log(posts.toString());
      },
      child: const Text('Get posts')
    )
    

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

1 回复

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


network_bound_resource 是一个在 Flutter 中用于处理网络请求和本地缓存的开源库。它结合了网络请求和本地存储的优势,确保在获取数据时先从本地缓存读取,如果缓存不存在或已过期,则从网络获取数据并更新缓存。

主要特点

  1. 本地缓存优先:先从本地缓存读取数据,如果缓存不存在或已过期,再从网络获取。
  2. 自动缓存更新:从网络获取数据后,自动更新本地缓存。
  3. 简化的 API:提供简单的 API 来管理网络请求和缓存。

安装

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

dependencies:
  flutter:
    sdk: flutter
  network_bound_resource: ^1.0.0  # 请查看最新版本

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

使用示例

以下是一个简单的使用示例,展示如何使用 network_bound_resource 来获取网络数据并缓存。

import 'package:flutter/material.dart';
import 'package:network_bound_resource/network_bound_resource.dart';
import 'package:http/http.dart' as http;
import 'dart:convert';

class NetworkBoundResourceExample extends StatelessWidget {
  Future<String> fetchDataFromNetwork() async {
    final response = await http.get(Uri.parse('https://jsonplaceholder.typicode.com/posts/1'));
    if (response.statusCode == 200) {
      return response.body;
    } else {
      throw Exception('Failed to load data');
    }
  }

  Future<String> loadDataFromCache() async {
    // 模拟从本地缓存加载数据
    await Future.delayed(Duration(seconds: 1));
    return 'Cached Data';
  }

  Future<void> saveDataToCache(String data) async {
    // 模拟将数据保存到本地缓存
    await Future.delayed(Duration(seconds: 1));
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('NetworkBoundResource Example'),
      ),
      body: Center(
        child: FutureBuilder<String>(
          future: NetworkBoundResource<String>(
            loadFromCache: loadDataFromCache,
            shouldFetch: (cachedData) => cachedData == null || cachedData.isEmpty,
            fetchFromNetwork: fetchDataFromNetwork,
            saveToCache: saveDataToCache,
          ).fetch(),
          builder: (context, snapshot) {
            if (snapshot.connectionState == ConnectionState.waiting) {
              return CircularProgressIndicator();
            } else if (snapshot.hasError) {
              return Text('Error: ${snapshot.error}');
            } else {
              return Text('Data: ${snapshot.data}');
            }
          },
        ),
      ),
    );
  }
}

void main() {
  runApp(MaterialApp(
    home: NetworkBoundResourceExample(),
  ));
}
回到顶部