Flutter中经过https post Json接收Json

Flutter 已然成为煊赫一时前端框架。若问跨平台到底有多香，天然是要多香有多香。今天我就分享这些天研究Flutter http链接和json格式转换的内容，小弟对Flutter也是小白一名，若有错误请多加指正。

源码下载地址

先来看看要完成的任务：调用https://test.apigj.com/apgetuserinfo 获取用户信息

{
  "userid": 7933833267642368
}

 

{
  "msg": "success",
  "code": 0,
  "userinfo": {
    "username": "Batman",
    "gender": 0,
    "birthday": 5025914914078720
  }
}

 

1. 处理Json和Object互转

Flutter 官方给出两种建议：手动序列化和自动生成代码的方式

手动序列化适合较小的项目，具备简单灵活的优点，但也容易出现因输入错误形成没法解析的小问题，我这里就不展开了

自动生成代码适合相对较大的项目，同时要求写class定义数据结构：

首先，修改pubspec.yaml文件

pubspec.yaml

 

添加json_annotation, build_runner和json_serializable包到指定位置

而后，完成class定义数据结构：

1个请求和2个返回

 

req_base.dart

 

res_common.dart 为了方便扩展全部的返回class都会继承这个基本的返回class

 

res_ap_get_user_info.dart 这个文件里同时包含了user_info的定义

class定义好后，这里还有些错误，缘由是还有些代码是须要Flutter自动生成的

在命令行中输入flutter pub run build_runner build

成功之后会生成几下.g.dart文件角，错误也就消失了

3个.g.dart文件

这些文件里是对应class的解析和编码的方法

res_ap_get_user_info.g.dart里面包含ResApGetUserInfo和UserInfo的解析和编码方法

这样Json处理内容就这些，已经能够很是方便的在对象和json之间互转了

2. Https请求和返回

Http请求为了防止线程阻塞，多数状况下要使用多线程实现，Flutter的HttpClient已经在底层作了线程处理，因此要使用async, await或者Future进行同步线程，这里是我Http请求的静态方法

没有找到办法传递类型并生成对象，因此最后仅转成Map输出

还有就是在Flutter Widget中调用请求的方法

请求并显示数据

 

最终的效果

整体来讲Flutter仍是比较容易上手的，但要深刻的话也能够实现多平台的Flutter库，基本上可使用Flutter实现一套代码跨平台，还不开始研究么？

本示例实体class结构定义经过Api管家自动生成