https://github.com/nggepe/http_cache_flutter
cacheable http request with interactive widget.
https://github.com/nggepe/http_cache_flutter
cache dart flutter flutter-package http
Last synced: 10 months ago
JSON representation
cacheable http request with interactive widget.
- Host: GitHub
- URL: https://github.com/nggepe/http_cache_flutter
- Owner: nggepe
- License: mit
- Created: 2022-10-04T12:36:52.000Z (over 3 years ago)
- Default Branch: master
- Last Pushed: 2023-02-08T11:41:57.000Z (almost 3 years ago)
- Last Synced: 2025-03-24T12:21:45.058Z (10 months ago)
- Topics: cache, dart, flutter, flutter-package, http
- Language: Dart
- Homepage:
- Size: 409 KB
- Stars: 5
- Watchers: 1
- Forks: 2
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# HTTP Cache Flutter
[](https://codecov.io/gh/nggepe/http_cache_flutter)
[](https://pub.dev/packages/http_cache_flutter)
[](https://github.com/nggepe/http_cache_flutter/actions/workflows/code-analyze.yml)
# Overview
The goal of this library is to make it easier for us to handle http requests and data caching by using interactive widgets. If you need any update or tutorial, please create an issue (here)[https://github.com/nggepe/http_cache_flutter/issues]
## HttpCache Widget class
[More complete `HttpCache` Widget documentation is here](https://github.com/nggepe/http_cache_flutter/tree/master/doc/http_cache_widget.md)
# Storage Initialization
Before implement this library, you should initialize the storage.
In your `main.dart` flutter file 👇🏻
```dart
import 'package:http_cache_flutter/http_cache_flutter.dart';
import 'package:path_provider/path_provider.dart';
import 'package:flutter/material.dart';
import 'package:flutter/foundation.dart';
void main() async {
WidgetsFlutterBinding.ensureInitialized();
await HttpCache.init(
storageDirectory: kIsWeb
? HttpCacheStorage.webStorageDirectory
: await getTemporaryDirectory());
runApp(const MyApp());
}
```
[More complete `HttpCache` Widget documentation is here](https://github.com/nggepe/http_cache_flutter/tree/master/doc/http_cache_widget.md)
# Clear Storage
```dart
HttpCache.storage.clear();
```
# How to remove cache?
You can use string pattern to remove your some url group
```dart
HttpCache.storage.invalidate("https://example.com");
```
# Usage Example
```dart
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:http_cache_flutter/http_cache_flutter.dart';
import 'package:path_provider/path_provider.dart';
void main() async {
WidgetsFlutterBinding.ensureInitialized();
await HttpCache.init(
storageDirectory: kIsWeb
? HttpCacheStorage.webStorageDirectory
: await getTemporaryDirectory());
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: 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({Key? key, required this.title}) : super(key: key);
final String title;
@override
State createState() => _MyHomePageState();
}
class _MyHomePageState extends State {
final url = "https://api.github.com/search/repositories?q=";
@override
Widget build(BuildContext context) {
return HttpCache>(
url: "${url}nggepe/http_cache_flutter",
log: const HttpLog(showLog: true),
refactorBody: (body, decodedBody) {
var items = decodedBody['items'] as List?;
return items?.map((e) {
return GithubRepository.fromMap(e);
}).toList() ??
[];
},
builder: (_, data) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
bottom: PreferredSize(
child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 16),
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
TextButton(
onPressed: () {
data.changeUrl("${url}flutter/flutter");
},
child: const Text(
"flutter/flutter",
style: TextStyle(color: Colors.white),
),
style: ButtonStyle(
backgroundColor:
MaterialStateProperty.resolveWith(
(states) => Colors.green,
)),
),
const SizedBox(width: 20),
TextButton(
onPressed: () {
data.changeUrl("${url}flutter/engine");
},
child: const Text(
"flutter/engine",
style: TextStyle(color: Colors.white),
),
style: ButtonStyle(
backgroundColor:
MaterialStateProperty.resolveWith(
(states) => Colors.green,
)),
),
],
),
),
preferredSize: Size(MediaQuery.of(context).size.width, 50)),
),
body: Center(
child: data.isLoading
? const CircularProgressIndicator()
: ListView(
children: [
Column(
children: data.refactoredBody
?.map(
(e) => Padding(
padding: const EdgeInsets.symmetric(
vertical: 16, horizontal: 8),
child: Column(
children: [
Text(e.name),
Text(e.fullName),
],
),
),
)
.toList() ??
[],
),
TextButton(
onPressed: data.fetchWithLoading,
child: const Text('fetch')),
],
),
),
floatingActionButton: FloatingActionButton(
onPressed: data.fetchWithLoading,
child: const Icon(Icons.refresh)),
);
});
}
}
class GithubRepository {
final String nodeId;
final String name;
final String fullName;
const GithubRepository(
{required this.nodeId, required this.name, required this.fullName});
factory GithubRepository.fromMap(Map map) {
return GithubRepository(
nodeId: map['node_id'],
name: map['name'],
fullName: map['full_name'],
);
}
}
```
# Update Coming Soon
## HttpCachePaged Widget
Feature
Status
Persistent Cache Storage
⏳
Handle Change URL
⏳
Handle stale data
⏳
Handle log
⏳
Handle timeout cache
⏳
Handle Data Mutation
⏳
Paged http cache
⏳
Dev tool
⏳
Paging
⏳