Flutter网络请求的3种简单实现方法
作者:Silence_Zhou 发布时间:2023-06-21 10:53:22
概述:
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<String, String>();
// 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<String, String>();
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<String, String>();
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<String, String>();
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<String, String>();
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<String, String>();
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<String, String>();
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('请求失败');
}
}
来源:https://juejin.im/post/5ca397bb51882543b470677b
![](https://www.aspxhome.com/images/zang.png)
![](https://www.aspxhome.com/images/jiucuo.png)
猜你喜欢
- 一、熔断器简介微服务架构特点就是多服务,多数据源,支撑系统应用。这样导致微服务之间存在依赖关系。如果其中一个服务故障,可能导致系统宕机,这就
- 关于ListView拖拽移动位置,想必大家并不陌生,比较不错的软件都用到如此功能了.如:搜狐,网易,百度等,但是相比来说还是百度的用户体验较
- 之前使用springMVC+spring+mybatis,总是被一些繁琐的xml配置,有时候如果配置出错,还要检查各种xml配置,偶然接触到
- 库从本质上来说是一种可执行代码的二进制格式,可以被载入内存中执行。库分静态库和动态库两种。 一、静态库和动态库的区别1. 静态函数库这类库的
- 将二维数组转化为一维数组1. 为了偷懒所以我写了一个随机生成二维数组的函数/* * 自动创建随机为100以内的二维
- AI 平台:http://ai.baidu.com/开发工具:vs 2017准备工作1、注册百度账号2、登录百度 AI 开发平台,http:
- TCP和UDP在网络传输中非常重要,在Android开发中同样重要。首先我们来看一下什么是TCP和UDP。什么是TCP?TCP:Transm
- 本文实例讲述了android开发之listView组件用法。分享给大家供大家参考,具体如下:关于Android ListView组件中and
- 这篇文章主要介绍了springboot自定义异常视图过程解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需
- 1. 注解开发依赖注入1.1 使用@Autowired注解开启自动装配模式@Servicepublic class BookServiceI
- 1.Shito简介1.1 什么是shiroApache Shiro是一个java安全(权限)框架Shiro可以非常容易的开发出足够好的应用,
- 一个activity就好比一个网页,此文章讲解怎样创建一个activity并且实现跳转!一、学习创建Activity1、新建一个java类,
- 最近一直在对接接口,上游返回的都是 JSON 数据,我们需要将这些数据进行保存,我们可以解析成 Map 通过 key 的方式进行获取,然后
- 本文实例为大家分享了Flutter自定义底部导航栏的具体代码,供大家参考,具体内容如下文件结构:main.dartimport 'p
- 需求:类似医院或者商场,大屏幕无限轮播item (广告词/广告图…),供大家参考,具体内容如下代码如下/** * Created by Xi
- 已经下过好几次了,现在还是忘了。就把过程直接放上面了。下次再换电脑就直接可以看。。。0.下载之前需要把JDK安装和配置好,点这里:https
- 先介绍去掉标题栏的方法: 第一种:也一般入门的时候经常使用的一种方法 requestWindowFeature(Window.FEATURE
- 最近项目需要实现PDF下载的功能,由于没有这方面的经验,从网上花了很长时间查找了相关的资料。整理之后,发现有几个框架可以实现这个功能。1.
- String 对象是不可改变的。每次使用 System.String 类中的方法之一时,都要在内存中创建一个新的字符串对象,这就需要为该新对
- Android 使用log4j前言: 如果要直接在android工程中使用log4j,是有点问题的,会报如下的错: 1