dio 是dart 開源的網(wǎng)絡(luò)庫 ，基于dart語言 绕辖。使用簡單摇肌，性能穩(wěn)定 。
一.dio的架構(gòu)
執(zhí)行流：
請求攔截器 >> 請求轉(zhuǎn)換器 >> 發(fā)起請求 >> 響應(yīng)轉(zhuǎn)換器 >> 響應(yīng)攔截器 >> 最終結(jié)果引镊。
支持的功能：
http朦蕴、FormData、攔截器弟头、請求取消吩抓、Cookie管理、文件上傳/下載赴恨、超時(shí)疹娶、錯(cuò)誤處理、轉(zhuǎn)換器伦连、代理雨饺。
二、 開始實(shí)驗(yàn)
1. 引入包
知識點(diǎn)：
1.flutter有自己的包管理倉庫 Pub
- flutter可以引入 pub包惑淳，本地路徑包额港，git包 ，github包
- flutter核心庫不包含顏色歧焦，要使用 css_colors 第三方庫
- 要使用瀏覽器 要參考 url_launcher第三方庫
使用方法：
1.打開 pubspec.yaml 文件移斩，然后在dependencies下添加dio: 2.1.x (表示最新版)
- 終端運(yùn)行
flutter packages get
3.在main.dart中引入開始使用
三.dio的使用
1. 自己準(zhǔn)備一個(gè)服務(wù)器接口 。(有接口的跳過不用自己搭建一個(gè)服務(wù)器了)
這里我是用swift語言自己在本機(jī)搭建一個(gè)PerfectSwift
不愿意研究的可以直接下面，有時(shí)間了寫一個(gè)完整的swift服務(wù)器的教程
注：【】中表示輸入的命令
bogon:~ home$ 【 mkdir /Users/chaoshen/SwiftServer 】
bogon:~ home$ 【 cd /Users/chaoshen/SwiftServer 】
bogon:SwiftServer home$ 【 git clone https://github.com/PerfectlySoft/PerfectTemplate.git】
Cloning into 'PerfectTemplate'...
remote: Enumerating objects: 275, done.
remote: Total 275 (delta 0), reused 0 (delta 0), pack-reused 275
Receiving objects: 100% (275/275), 60.50 KiB | 160.00 KiB/s, done.
Resolving deltas: 100% (137/137), done.
bogon:SwiftServer home$ 【 cd PerfectTemplate 】
bogon:PerfectTemplate home$ 【 swift build】
省略編譯信息
bogon:PerfectTemplate home$【 .build/debug/PerfectTemplate】
[INFO] Starting HTTP server localhost on :::8181#表示啟動了
成功之后瀏覽器輸入http://127.0.0.1:8181/
有界面出現(xiàn)就是成功了向瓷。 PerfectTemplate/main.swift 更改文件可以更改接口
終端【ctrl + c】 停止運(yùn)行
進(jìn)入目錄查看一下
如果你是用xcode開發(fā) 肠套，隨意位置建立一個(gè)文件夾 【cd】/終端【swift package generate-xcodeproj
】，建立一個(gè)server服務(wù)器項(xiàng)目一直使用xcode寫就可以了猖任。
vccode 寫app xcode寫服務(wù)器是不是不要太爽啊????????
holle world是個(gè)頁面web接口 你稚。業(yè)務(wù)接口返回json那種怎么寫 。
將下面代碼覆蓋main.swift,重新啟動服務(wù)器接口就可以請求了朱躺。
如果你不了解服務(wù)器編寫/ 現(xiàn)在還不建議你用xcode編寫刁赖，因?yàn)闀写罂樱看卧黾游募蛘邉h除文件都要重新編譯长搀，【打包】Xcode工程
2. 刪除test文件夾 以及里面的文件 乾闰，刪除 main.dart的所有內(nèi)容 ，寫一個(gè)簡單的例子運(yùn)行一下
2.1get接口獲取
import 'package:dio/dio.dart';
void main() => getHttp(); ##主函數(shù)入口
void getHttp() async { ## 異步處理
try { ##不崩潰處理
Response response = await
Dio().get("http://192.168.1.107:8181/getDatas");
print("我很帥" + response.toString());
} catch (e) {
print("我不帥" + e.toString());
}
}
2.2post接口獲取
import 'package:dio/dio.dart';
void main() => getHttp(); ##主函數(shù)入口
void getHttp() async { ## 異步處理
try { ##不崩潰處理
Response response = await
Dio().post("http://192.168.1.107:8181/getDatas",data:{"id":12,"name":"wendu"});
print("我很帥" + response.toString());
} catch (e) {
print("我不帥" + e.toString());
}
}
2.3 多個(gè)接口
future 參見文章
response= await Future.wait([dio.post("/mobile"),dio.get("/token")]);
2.4 下載文件
我們下載一張圖片試試
import 'dart:async';
import 'dart:io';
import 'package:dio/dio.dart';
// In this example we download a image and listen the downloading progress.
main() async {
var dio = new Dio();
dio.interceptors.add(LogInterceptor());
// This is big file(about 200M)
// var url = "http://download.dcloud.net.cn/HBuilder.9.0.2.macosx_64.dmg";
var url =
"https://cdn.jsdelivr.net/gh/flutterchina/flutter-in-action@1.0/docs/imgs/book.jpg";
// var url = "https://www.baidu.com/img/bdlogo.gif";
// await download1(dio, url, "./example/book1.jpg");
await download1(dio, url, (HttpHeaders headers)=>"./example/book1.jpg");
//await download2(dio, url, "./example/book2.jpg");
}
Future download1(Dio dio, String url, savePath) async {
try {
await dio.download(
url,
savePath,
onReceiveProgress: showDownloadProgress,
);
} catch (e) {
print(e);
}
}
Future download2(Dio dio, String url, String savePath) async {
try {
Response response = await dio.get(
url,
onReceiveProgress: showDownloadProgress,
//Received data with List<int>
options: Options(
responseType: ResponseType.bytes,
followRedirects: false,
),
);
print(response.headers);
File file = new File(savePath);
var raf = file.openSync(mode: FileMode.write);
// response.data is List<int> type
raf.writeFromSync(response.data);
await raf.close();
} catch (e) {
print(e);
}
}
void showDownloadProgress(received, total) {
if (total != -1) {
print((received / total * 100).toStringAsFixed(0) + "%");
}
}
2.5 后面都嘗試一下可以干什么
四. json字符串的反序列化
1.中文官網(wǎng)介紹
注意：
使用 dart:convert ,flutter 禁止運(yùn)行時(shí)反射
- 單個(gè)無依賴的model 可以使用 JSON.decode()
class User {
final String name;
final String email;
User(this.name, this.email);
User.fromJson(Map<String, dynamic> json)
: name = json['name'],
email = json['email'];
Map<String, dynamic> toJson() =>
{
'name': name,
'email': email,
};
}
調(diào)用
Map userMap = JSON.decode(json);
var user = new User.fromJson(userMap);
print('Howdy, ${user.name}!');
print('We sent the verification link to ${user.email}.');
- 一個(gè)User.fromJson 構(gòu)造函數(shù), 用于從一個(gè)map構(gòu)造出一個(gè) User實(shí)例 map structure
- 一個(gè)toJson 方法, 將 User 實(shí)例轉(zhuǎn)化為一個(gè)map.
2. 在大中型項(xiàng)目中使用代碼生成, 例如盈滴，json_serializable和built_value這樣的庫。
我們以 json_serializable 為例子來研究轿钠，引入包
json_serializable package
2.1 引入
需要在pubspec.yaml添加三個(gè)依賴巢钓，它們分別是："son_annotation" "build_runner" 和 "json_serializable"。
dependencies:
# Your other regular dependencies here
json_annotation: '>=2.1.0 <2.3.0' # json反序列化json_serializable需要
dev_dependencies:
# Your other dev_dependencies here
build_runner: ^1.0.0 # #創(chuàng)建.g.dart json反序列化json_serializable需要
json_serializable: '2.1.0 <2.3.0' # json反序列化json_serializable需要
注意yaml文件的縮進(jìn)要求很嚴(yán)格疗垛，與python類似
2.2 環(huán)境配置
根目錄運(yùn)行
flutter packages pub run build_runner build #利用build_runner設(shè)置環(huán)境依賴
flutter packages pub run build_runner watch #當(dāng)創(chuàng)建模型文件時(shí)自動創(chuàng)建 “.g.dart”文件
注意：watch 命令不取消會一直運(yùn)行症汹，只要創(chuàng)建就會生成一個(gè).g.dart 文件 ,
ctrl + C終端取消。 也可以每次都build 重新生成 贷腕。 需要重新生成的可以刪除.g.dart文件背镇，重新build 命令。
2.3 創(chuàng)建模型文件
Person.dart文件
/**Person model class */
import 'package:json_annotation/json_annotation.dart';
part 'Person.g.dart';
///標(biāo)志class需要實(shí)現(xiàn)json序列化功能
@JsonSerializable()
///里面有兩個(gè)屬性 name和id
class Person extends Object {
String name;
int id;
///通過JsonKey重新定義參數(shù)名
@JsonKey(name: "details_id")
int detailsId;
/// 構(gòu)造函數(shù)
Person(this.name, this.id, this.detailsId);
/// _$HomeModelFromJson 這個(gè)函數(shù)在.g.dart中泽裳，命名就是類名+FromJson
/// 直接寫就行 報(bào)錯(cuò)也沒關(guān)系 生成.g.dart文件之后就好了
factory Person.fromJson(Map<String, dynamic> json) => _$PersonFromJson(json);
}
五.錯(cuò)誤處理
1.出現(xiàn)錯(cuò)誤信息： Program ended with exit code: 0
解決方法 ：
sudo lsof -i -P | grep -i "listen" # 查看所有監(jiān)聽信息 瞒斩，找到占用端口的 【pid】 ，會卡一會查詢中 涮总，進(jìn)程名字是PerfectTe
kill 【pid】 # pid 是上命令中查到的進(jìn)程id
WARNING: CocoaPods requires your terminal to be using UTF-8 encoding.
