Flutter網(wǎng)絡(luò)請(qǐng)求Dio庫(kù)的使用及封裝詳解
Dart語(yǔ)言內(nèi)置的HttpClient實(shí)現(xiàn)了基本的網(wǎng)絡(luò)請(qǐng)求相關(guān)的操作。但HttpClient本身功能較弱,很多網(wǎng)絡(luò)請(qǐng)求常用功能都不支持,因此在實(shí)際項(xiàng)目中,我們更多是使用dio庫(kù)實(shí)現(xiàn)網(wǎng)絡(luò)請(qǐng)求。
注:Flutter官網(wǎng)同樣推薦在項(xiàng)目中使用Dio庫(kù)。
Dio文檔地址: pub.dev地址:dio | Dart Package
一、項(xiàng)目目錄結(jié)構(gòu)

| 文件夾 | 功能 |
|---|---|
| components | 放置全局共用組件 |
| router | 全局路由管理 |
| service | 管理接口請(qǐng)求并對(duì)返回?cái)?shù)據(jù)進(jìn)行處理,復(fù)雜功能邏輯處理 |
| store | provider全局狀態(tài)管理 |
| utile | 工具類,例如:接口請(qǐng)求工具類,數(shù)據(jù)持久化工具類,加密解密工具類…… |
| views | 界面管理,實(shí)現(xiàn)界面UI繪制的代碼邏輯 |
二、封裝思路:
1、在DioRequest工具類中統(tǒng)一初始化網(wǎng)絡(luò)請(qǐng)求常見配置,實(shí)現(xiàn)請(qǐng)求攔截器、響應(yīng)攔截器以及錯(cuò)誤處理。
2、統(tǒng)一在service中管理接口請(qǐng)求,并且對(duì)返回的數(shù)據(jù)根據(jù)實(shí)際需求進(jìn)行處理,如果數(shù)據(jù)的修改需要更新UI或者需要全局共享該數(shù)據(jù),可以結(jié)合provider實(shí)現(xiàn)。
三、添加依賴
在pubspec.yaml文件中添加所需要的第三方依賴庫(kù)
dev_dependencies:
flutter_test:
sdk: flutter
# The "flutter_lints" package below contains a set of recommended lints to
# encourage good coding practices. The lint set provided by the package is
# activated in the `analysis_options.yaml` file located at the root of your
# package. See that file for information about deactivating specific lint
# rules and activating additional ones.
flutter_lints: ^1.0.0
# 數(shù)據(jù)請(qǐng)求
dio: ^4.0.4
四、簡(jiǎn)單實(shí)現(xiàn)網(wǎng)絡(luò)請(qǐng)求
在utils目錄中新建dio_request.dart文件實(shí)現(xiàn)DioRequest網(wǎng)絡(luò)請(qǐng)求的工具類。
import 'package:dio/dio.dart';
/// dio網(wǎng)絡(luò)請(qǐng)求配置表 自定義
class DioConfig {
static const baseURL = 'http://117.34.71.31:8081/paas-admin'; //域名
static const timeout = 10000; //超時(shí)時(shí)間
}
// 網(wǎng)絡(luò)請(qǐng)求工具類
class DioRequest {
late Dio dio;
static DioRequest? _instance;
/// 構(gòu)造函數(shù)
DioRequest() {
dio = Dio();
dio.options = BaseOptions(
baseUrl: DioConfig.baseURL,
connectTimeout: DioConfig.timeout,
sendTimeout: DioConfig.timeout,
receiveTimeout: DioConfig.timeout,
contentType: 'application/json; charset=utf-8',
headers: {});
/// 請(qǐng)求攔截器 and 響應(yīng)攔截機(jī) and 錯(cuò)誤處理
dio.interceptors.add(InterceptorsWrapper(onRequest: (options, handler) {
print("\n================== 請(qǐng)求數(shù)據(jù) ==========================");
print("url = ${options.uri.toString()}");
print("headers = ${options.headers}");
print("params = ${options.data}");
return handler.next(options);
}, onResponse: (response, handler) {
print("\n================== 響應(yīng)數(shù)據(jù) ==========================");
print("code = ${response.statusCode}");
print("data = ${response.data}");
print("\n");
handler.next(response);
}, onError: (DioError e, handler) {
print("\n================== 錯(cuò)誤響應(yīng)數(shù)據(jù) ======================");
print("type = ${e.type}");
print("message = ${e.message}");
print("\n");
return handler.next(e);
}));
}
static DioRequest getInstance() {
return _instance ??= DioRequest();
}
}
五、實(shí)現(xiàn)登錄注冊(cè)服務(wù)
在lib下新建service目錄,并在service目錄中新建login.dart文件。
import 'dart:convert';
import 'package:cyber_security/utils/http.dart';
class LoginService {
/// 獲取用戶數(shù)據(jù)中心列表
static Future<List> getDataCenter() async {
var response = await DioRequest.getInstance().dio.get('/getDataCenter');
var data = jsonDecode(response.toString());
return data['dataCenterList'];
}
/// 登錄接口
static login(value) async {
var response = await DioRequest.getInstance()
.dio
.post('/sys/login', queryParameters: value);
var data = jsonDecode(response.toString());
/// 對(duì)返回的身份憑證全局持久化存儲(chǔ)
return data['key'];
}
/// 獲取權(quán)限列表
static menuNav() async {
var response = await DioRequest.getInstance().dio.get('/sys/menu/nav');
var data = jsonDecode(response.toString());
return data['key'];
}
}
六、使用service服務(wù)
@override
void initState() {
// TODO: implement initState
super.initState();
/// 請(qǐng)求用戶數(shù)據(jù)中心數(shù)據(jù)
LoginService.getDataCenter().then((value) {
setState(() {
_dataCenterList = value;
});
});
}
到此這篇關(guān)于Flutter網(wǎng)絡(luò)請(qǐng)求Dio庫(kù)的使用及封裝詳解的文章就介紹到這了,更多相關(guān)Flutter Dio庫(kù)內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
Android 編程下字庫(kù)的使用及注意事項(xiàng)
在安卓操作系統(tǒng)下對(duì)于 TextView 字體的支持非常有限,默認(rèn)情況下TextView的typeface屬性支持三種字體;接下來(lái)本文將會(huì)介紹Android 編程下字庫(kù)的使用及注意事項(xiàng),感興趣的朋友可以了解下,希望對(duì)你有所幫助2013-01-01
Android自定義控件實(shí)現(xiàn)支付寶記賬餅圖
這篇文章主要為大家詳細(xì)介紹了Android自定義控件實(shí)現(xiàn)支付寶記賬餅圖,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2018-04-04
詳解Android中實(shí)現(xiàn)ListView左右滑動(dòng)刪除條目的方法
這篇文章主要介紹了Android中實(shí)現(xiàn)ListView左右滑動(dòng)刪除條目的方法,文中分別展示了通過(guò)Scroller和NineOldAndroids來(lái)實(shí)現(xiàn)的例子,需要的朋友可以參考下2016-04-04
android側(cè)滑菜單控件DrawerLayout使用方法詳解
這篇文章主要為大家詳細(xì)介紹了android側(cè)滑菜單控件DrawerLayout的使用方法,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-12-12
Assert.assertEquals()方法參數(shù)詳解
本文詳細(xì)講解了Assert.assertEquals()方法參數(shù),文中通過(guò)示例代碼介紹的非常詳細(xì)。對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2021-12-12
Android5.1 取消錄制屏幕跳出的權(quán)限對(duì)話框問(wèn)題
這篇文章主要介紹了Android5.1 取消錄制屏幕跳出的權(quán)限對(duì)話框問(wèn)題,需要的朋友可以參考下2017-04-04
Android Studio 下自動(dòng)注釋(自定義作者,類作用等)圖文詳解
android studio 下自動(dòng)注釋功能居然被隱藏了,很多功能都不見了,下面小編通過(guò)本文給大家分享Android Studio 下自動(dòng)注釋(自定義作者,類作用等)圖文詳解,需要的朋友參考下吧2017-11-11
解決Android Studio 格式化快捷鍵和QQ 鎖鍵盤快捷鍵沖突問(wèn)題
每次打開qq使用android studio格式化的快捷鍵Ctrl + Alt +L時(shí),總是出現(xiàn)qq鎖鍵盤提示,怎么回事呢?下面小編給大家?guī)?lái)了android studio格式化的快捷鍵和qq快捷鍵之間的沖突的處理方法,需要的朋友參考下吧2017-12-12

