4赞

Flutter网络请求的3种简单实现方法

作者：ifx0448363 | 2021-10-21 17:44

这篇文章主要给大家介绍了给大家Flutter网络请求的3种简单实现方法，文中通过示例代码介绍的非常详细，对大家学习或者使用Flutter具有一定的参考学习价值，需要的朋友们下面来一起学习学习吧

概述：

App几乎都离不开与服务器的交互，本文主要讲解了flutter网络请求三种方式 flutter自带的HttpClient、第三方库http 和第三方库Dio 的简单实现 GET 和 POST请求，本文是笔者学习Flutter网络模块知识总结，若有问题还望不腻赐教。

一.系统自带HttpClient

1.使用中温馨提示

1.1.导入库

import 'dart:io'; // 网络请求
import 'dart:convert'; // 数据解析

1.2.Uri的多种初始化方式

// 方法1
Uri uri = Uri(scheme: 'https', host: 'app.xxx.com', path: homeNoviceListUrl);
// 方法2
Uri uri = Uri.https('app.xxx.com', homeNoviceListUrl);
// uri方法3
Uri uri = Uri.parse(baseUrl + homeNoviceListUrl);

2.简单使用

2.1.GET请求

// 1.1 HttpClient - get 

void loadData_sys_get() async {
print('------loadData_sys_get--------');

var httpClient = new HttpClient();
var params = Map();

// uri方法1
Uri uri =
 Uri(scheme: 'https', host: 'app.xxx.com', path: homeNoviceListUrl);

// uri方法2
// Uri uri = Uri.https(
// 'app.xxx.com', homeNoviceListUrl);

// uri方法3
// Uri uri = Uri.parse(baseUrl + homeNoviceListUrl);

var request = await httpClient.getUrl(uri);

var headers = Map();
headers['loginSource'] = 'IOS';
headers['useVersion'] = '3.1.0';
headers['isEncoded'] = '1';
headers['bundleId'] = 'com.xxx.xxx';

request.headers.add("loginSource", "IOS");
request.headers.add("useVersion", "3.1.0");
request.headers.add("isEncoded", "1");
request.headers.add("bundleId", "com.xxx.xxx");

var response = await request.close();
var responseBody = await response.transform(Utf8Decoder()).join();

if (response.statusCode == HttpStatus.ok) {
 print('请求头：${response.headers}');

 print('111请求成功代发数据为:\n $responseBody');
 print('--------------');
 Map data = jsonDecode(responseBody);
 print('222请求成功代发数据为:\n $data');
} else {
 print('\n\n\n11111==请求失败${response.statusCode}');
}
}

2.2.POST请求

注意点：请求参数需要编码后放在request中

void loadData_sys_post() async {
print('------loadData_sys_post--------');

HttpClient httpClient = new HttpClient();

// queryParameters get请求的查询参数(适用于get请求？？？是吗？？？)
// Uri uri = Uri(
// scheme: "https", host: "app.xxx.com", path: homeRegularListUrl);
// HttpClientRequest request = await httpClient.postUrl(uri);

var url = baseUrl + homeRegularListUrl;
HttpClientRequest request = await httpClient.postUrl(Uri.parse(url));

// 设置请求头
request.headers.set("loginSource", "IOS");
request.headers.set("useVersion", "3.1.0");
request.headers.set("isEncoded", "1");
request.headers.set("bundleId", "com.xxx.xxx");
// Content-Type大小写都ok
request.headers.set('content-type', 'application/json');

/// 添加请求体
/// https://stackoverflow.com/questions/50278258/http-post-with-json-on-body-flutter-dart/50295533
Map jsonMap = {'currentPage': '1'};
request.add(utf8.encode(json.encode(jsonMap)));

HttpClientResponse response = await request.close();
String responseBody = await response.transform(utf8.decoder).join();
if (response.statusCode == HttpStatus.ok) {
 print('请求成功');
 print(response.headers);
 print(responseBody);
}
}

二.请求第三方库 http

1.使用中温馨提示

1.1.添加依赖

dependencies:
 http: ^0.12.0 #latest version

1.2.导入库

import 'package:http/http.dart' as http; //导入前需要配置

2.简单使用

2.1. GET请求

2.2.1. http - get1

 void loadData_http_get() async {
 print('------loadData_http_get--------');

 var client = http.Client();

 var uri = Uri.parse(baseUrl + homeNoviceListUrl);

 http.Response response = await client.get(uri);

 if (response.statusCode == HttpStatus.ok) {
 print(response.body);
 } else {
 print('请求失败 code 码为${response.statusCode}');
 }
 }

2.2. http - get简便方法（链式编程）

void loadData_http_get_convenience() async {
 print('------简便方法loadData_http_get_convenience--------');

 var uri = Uri.parse(baseUrl + homeNoviceListUrl);

 http.Client().get(uri).then((http.Response response) {
 if (response.statusCode == HttpStatus.ok) {
 print(response.body);
 } else {
 print('请求失败 code 码为${response.statusCode}');
 }
 });
 }

2.2. POST请求

2.2.1. http - post

 void loadData_http_post() async {
 print('------ loadData_http_post --------');

 var headers = Map();
 headers["loginSource"] = "IOS";
 headers["useVersion"] = "3.1.0";
 headers["isEncoded"] = "1";
 headers["bundleId"] = "com.xxx.xxx";
 headers["loginSource"] = "IOS";
 headers["Content\-Type"] = "application/json";

 Map params = {'currentPage': '1'};
 // 嵌套两层都可以，但是具体哪个好还有待确认？？？？
 var jsonParams = utf8.encode(json.encode(params));
 // var jsonParams = json.encode(params);

 var httpClient = http.Client();

 var uri = Uri.parse(baseUrl + homeNoviceListUrl);

 http.Response response =
 await httpClient.post(uri, body: jsonParams, headers: headers);

 if (response.statusCode == HttpStatus.ok) {
 print(response.body);
 } else {
 print('请求失败 code 码���${response.statusCode}');
 }
 }

2.2.2. http - Post简便方法（链式编程）

 void loadData_http_post_convenience() async {
 print('------ loadData_http_post --------');

 var headers = Map();
 headers["loginSource"] = "IOS";
 headers["useVersion"] = "3.1.0";
 headers["isEncoded"] = "1";
 headers["bundleId"] = "com.xxx.xxx";
 headers["loginSource"] = "IOS";
 headers["Content\-Type"] = "application/json";

 Map params = {'currentPage': '1'};
 // 嵌套两层都可以，但是具体哪个好还有待确认？？？？
 var jsonParams = utf8.encode(json.encode(params));
 // var jsonParams = json.encode(params);

 var httpClient = http.Client();

 var url = baseUrl + homeRegularListUrl;

 httpClient.post(url, body: jsonParams, headers: headers).then((response) {
 print("Response status: ${response.statusCode}");
 print("Response body: ${response.body}");
 }).whenComplete(httpClient.close);
 }

三.请求第三方库 Dio

1.使用中温馨提示

1.1.添加依赖

dependencies:
 dio: ^2.0.11 #latest version

1.2.导入库

import 'package:dio/dio.dart';

2.简单使用

2.1. GET请求

注意：Dio的get请求（baseUrl都是在dio.option.baseUrl设置的）请求头可以在dio.option上设置，也可以在新建的option上设置,新建option是可选的

void loadData_dio_get() async {
 var headers = Map();
 headers['loginSource'] = 'IOS';
 headers['useVersion'] = '3.1.0';
 headers['isEncoded'] = '1';
 headers['bundleId'] = 'com.xxx.xxx';
 headers['Content-Type'] = 'application/json';

 Dio dio = Dio();
 dio.options.headers.addAll(headers);
 dio.options.baseUrl = baseUrl;

 Response response = await dio.get(homeNoviceListUrl);

 if (response.statusCode == HttpStatus.ok) {
 print(response.headers);
 print(response.data);
 }
 }

2.2. POST请求

注意：

dio.options.method设置是无效
Dio dio = Dio();
dio.options.method = 'post';

办法：
新建一个Options对象，然后在发起请求的时候进行设置：
Options option = Options(method:'post');
Response response = await dio.request(homeRegularListUrl,data:{"currentPage": "1"}, options: option);

2.2.1. dio - 方式一（baseUrl都是在dio.option.baseUrl设置的）

注意：直接在 dio.options设置除methods以外的请求头参数

void loadData_dio_dioOfOptionsSetting() async {
 debugPrint(
 ' \n post请求 ======================= 开始请求 =======================\n');
 var headers = Map();
 headers['loginSource'] = 'IOS';
 headers['useVersion'] = '3.1.0';
 headers['isEncoded'] = '1';
 headers['bundleId'] = 'com.xxx.xxx';
 headers['Content-Type'] = 'application/json';

 Dio dio = Dio();
 dio.options.baseUrl = baseUrl;
 dio.options.connectTimeout = 60000;
 dio.options.receiveTimeout = 60000;
 dio.options.headers.addAll(headers);
 dio.options.method = 'post';

 Options option = Options(method: 'post');
 // Response response = await dio.request(homeRegularListUrl,
 // data: {"currentPage": "1"}, options: option);

 Response response = await dio.post(homeRegularListUrl,
 data: {"currentPage": "1"}, options: option);

 if (response.statusCode == HttpStatus.ok) {
 debugPrint('请求参数： ${response.request.queryParameters}');
 debugPrint(
  '-------------------请求成功,请求结果如下:-----------------\n \n===请求求url: ${response.request.uri.toString()} \n \n===请求 ���: \n${response.headers} \n \n===请求结果: \n${response.data}\n');
 debugPrint('-------------------请求成功,请求结果打印完毕----------------');
 } else {
 print('请求失败');
 }
 }

2.2.2. dio - 方式二（baseUrl都是在dio.option.baseUrl设置的）

注意：在新建的option上设置请求头参数

void loadData_dio_newOptionSetting() async {
 debugPrint(' \n======================= 开始请求 =======================\n');
 var headers = Map();
 headers['loginSource'] = 'IOS';
 headers['useVersion'] = '3.1.0';
 headers['isEncoded'] = '1';
 headers['bundleId'] = 'com.xxx.xxx';
 headers['Content-Type'] = 'application/json';

 Options option = Options(method: 'post');
 option.connectTimeout = 60000;
 option.receiveTimeout = 60000;
 option.headers.addAll(headers);

 Dio dio = Dio();
 dio.options.baseUrl = baseUrl;

 Response response = await dio.post(homeRegularListUrl,
 data: {"currentPage": 1}, options: option);
 // Response response = await dio.request(homeRegularListUrl,
 // data: {"currentPage": 1}, options: option);

 if (response.statusCode == HttpStatus.ok) {
 debugPrint('请求参数： ${response.request.queryParameters}');
 debugPrint(
  '-------------------请求成功,请求结果如下:-----------------\n \n===请求url: ${response.request.uri.toString()} \n \n===请求 头: \n${response.headers} \n \n===请求结果: \n${response.data}\n');
 debugPrint('-------------------请求成功,请求结果打印完毕----------------');
 } else {
 print('请求失败');
 }
 }

总结

以上就是这篇文章的全部内容了，希望本文的内容对大家的学习或者工作具有一定的参考学习价值，谢谢大家对的支持。

推荐阅读

程序员
无法隐藏子视图控制器中的标签栏

如何解决《无法隐藏子视图控制器中的标签栏》经验，为你挑选了0个好方法。 ... [详细]
程序员
Amazon SNS如何管理CloudWatch日志流以获取交付状态？

如何解决《AmazonSNS如何管理CloudWatch日志流以获取交付状态？》经验，为你挑选了0个好方法。 ... [详细]
程序员
在UISearchController中使用UISegmentedControl

如何解决《在UISearchController中使用UISegmentedControl》经验，为你挑选了1个好方法。 ... [详细]
程序员
为什么list.append(x)比list + = l [x]更有效？

如何解决《为什么list.append(x)比list+=l[x]更有效？》经验，为你挑选了1个好方法。 ... [详细]
程序员
最终参数在哪里存储在匿名类实例中？

如何解决《最终参数在哪里存储在匿名类实例中？》经验，为你挑选了1个好方法。 ... [详细]
程序员
如何使用java中的REGEX从字符串解析浮点值

如何解决《如何使用java中的REGEX从字符串解析浮点值》经验，为你挑选了1个好方法。 ... [详细]
程序员
如何在PHP中以DD-MMM-YY格式获取实际日期？

如何解决《如何在PHP中以DD-MMM-YY格式获取实际日期？》经验，为你挑选了2个好方法。 ... [详细]
程序员
在jquery中更改多个div位置

如何解决《在jquery中更改多个div位置》经验，为你挑选了1个好方法。 ... [详细]
程序员
iOS应用更新大小远大于应用大小

如何解决《iOS应用更新大小远大于应用大小》经验，为你挑选了1个好方法。 ... [详细]
程序员
指定使用jar文件的通用文件路径

如何解决《指定使用jar文件的通用文件路径》经验，为你挑选了1个好方法。 ... [详细]
程序员
Windows批处理字符串替换在变量给出搜索字符串时不起作用

如何解决《Windows批处理字符串替换在变量给出搜索字符串时不起作用》经验，为你挑选了0个好方法。 ... [详细]
程序员
有没有办法在Elixir中检查函数的arity？

如何解决《有没有办法在Elixir中检查函数的arity？》经验，为你挑选了1个好方法。 ... [详细]
程序员
暂停ansible playbook以进行用户确认,是否运行休息任务

如何解决《暂停ansibleplaybook以进行用户确认,是否运行休息任务》经验，为你挑选了1个好方法。 ... [详细]
程序员
ggplot2垂直线未插入所需位置

如何解决《ggplot2垂直线未插入所需位置》经验，为你挑选了1个好方法。 ... [详细]
程序员
使用Docker Hub和私有映像的Kubernetes PullImageError

如何解决《使用DockerHub和私有映像的KubernetesPullImageError》经验，为你挑选了2个好方法。 ... [详细]
程序员
Rest API的swagger和loopback之间的区别

如何解决《RestAPI的swagger和loopback之间的区别》经验，为你挑选了2个好方法。 ... [详细]
程序员
scanf和格式有关吗？

如何解决《scanf和格式有关吗？》经验，为你挑选了1个好方法。 ... [详细]
程序员
整数除法SQL查询产生意外的小数位数

如何解决《整数除法SQL查询产生意外的小数位数》经验，为你挑选了1个好方法。 ... [详细]
程序员
是否可以从.NET中的REST API获取复杂的Entity Framework对象而无需创建ViewModel对象？

如何解决《是否可以从.NET中的RESTAPI获取复杂的EntityFramework对象而无需创建ViewModel对象？》经验，为你挑选了0个好方法。 ... [详细]
程序员
使用Symfony从安全位置提供文件

如何解决《使用Symfony从安全位置提供文件》经验，为你挑选了1个好方法。 ... [详细]

ifx0448363

这个屌丝很懒，什么也没留下！

关注作者

Tags | 热门标签

RankList | 热门文章