本文介绍的步骤：在Flutter中常见的网络请求方式有三种：HttpClient、http库、dio库
一：httpClient
二：http
三：dio三方库
一：httpClient
httpClient是dart自带的请求类，在io包中，实现了基本的网络请求相关的操作。
// 一般需要导入这三个
import 'dart:convert'; // utf8.decoder
import 'dart:io'; // 用到 HttpClient请求⽅式 需要导入
import 'dart:async'; // 异步
getHttpClient() async {
var httpClient = new HttpClient();
var url = 'https://randomuser.me/api/?results=30';
var request = await httpClient.getUrl(Uri.parse(url));
var response = await request.close();
var jsonString = await response.transform(utf8.decoder).join();
// ignore: avoid_print
print('数据：${jsonString}');
}
OK，其实HttpClient也可以发送post相关的请求，我们这里就不再演练。
HttpClient虽然可以发送正常的网络请求，但是会暴露过多的细节：
比如需要主动关闭request请求，拿到数据后也需要手动的进行字符串解码
在开发中，我们一般很多直接面向HttpClient进行网络请求，而是使用一些库来完成。
二：http
http是Dart 官方提供的另一个网络请求类，相比于HttpClient，易用性提升了不少。
但是，没有默认集成到Dart的SDK中，所以我们需要先在pubspec中依赖它：
http: ^0.12.0+2
//导入并且使用即可
import 'package:http/http.dart' as http;
void httpNetwork() async {
// 1.创建Client
final client = http.Client();
// 2.构建uri
final url = Uri.parse("http://123.207.32.32:8000/api/v1/recommend");
// 3.发送请求
final response = await client.get(url);
// 4.获取结果
if (response.statusCode == HttpStatus.ok) {
print(response.body);
} else {
print(response.statusCode);
}
}
三：dio三方库
官方提供的HttpClient和http都可以正常的发送网络请求，但是对于现代的应用程序开发来说，我们通常要求的东西会更多：比如拦截器、取消请求、文件上传/下载、超时设置等等；
这个时候，我们可以使用一个在Flutter中非常流行的三方库：dio；
dio是一个强大的Dart Http请求库，支持Restful API、FormData、拦截器、请求取消、Cookie管理、文件上传/下载、超时、自定义适配器等...
使用dio三方库必然也需要先在pubspec中依赖它：
dio: ^4.0.4
// 代码演练：
import 'package:dio/dio.dart';
import 'dart:convert';
import 'dart:async';
void dioNetwork() async {
// 1.创建Dio请求对象
final dio = Dio();
// 2.发送网络请求
final response = await dio.get("http://123.207.32.32:8000/api/v1/recommend");
// 3.打印请求结果
if (response.statusCode == HttpStatus.ok) {
print(response.data);
} else {
print("请求失败：${response.statusCode}");
}
}
dio库的封装
1，实现封装
import 'package:dio/dio.dart';
import 'dart:convert';
import 'dart:async';
/// dio网络请求配置表 自定义
class DioConfig {
static const baseURL = 'http://117.34.71.31:8081/paas-admin'; //域名
static const timeout = 10000; //超时时间
}
// 网络请求工具类
class DioRequest {
late Dio dio;
static DioRequest? _instance;
/// 构造函数
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: {});
/// 请求拦截器 and 响应拦截机 and 错误处理
dio.interceptors.add(InterceptorsWrapper(onRequest: (options, handler) {
print("\n================== 请求数据 ==========================");
print("url = ${options.uri.toString()}");
print("headers = ${options.headers}");
print("params = ${options.data}");
return handler.next(options);
}, onResponse: (response, handler) {
print("\n================== 响应数据 ==========================");
print("code = ${response.statusCode}");
print("data = ${response.data}");
print("\n");
handler.next(response);
}, onError: (DioError e, handler) {
print("\n================== 错误响应数据 ======================");
print("type = ${e.type}");
print("message = ${e.message}");
print("\n");
return handler.next(e);
}));
}
static DioRequest getInstance() {
return _instance ??= DioRequest();
}
}
2，统一请求服务
import 'dart:convert';
import 'dart:async';
import 'package:cyber_security/utils/http.dart';
class LoginService {
/// 获取用户数据中心列表
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());
/// 对返回的身份凭证全局持久化存储
return data['key'];
}
/// 获取权限列表
static menuNav() async {
var response = await DioRequest.getInstance().dio.get('/sys/menu/nav');
var data = jsonDecode(response.toString());
return data['key'];
}
}
3，发起请求
@override
void initState() {
// TODO: implement initState
super.initState();
/// 请求用户数据中心数据
LoginService.getDataCenter().then((value) {
setState(() {
_dataCenterList = value;
});
});
}
