【Flutter / Dart】httpについて<APIとか>
概要
async awaitの次はこれだろう。
そう!ネットワーク通信における情報の取得だろう。(つまりAPIで情報を取得することだ)
httpについて
導入
pubspec.yamlに以下を記載し、flutter pub get
のコマンドを叩いて、ライブラリを取り込みます。
http: ^[最新のバージョン]
httpの記述
import 'package:http/http.dart' as http; // 使用時にライブラリをインポートする。
//get通信の場合
http.get(Uri.https('${ドメイン}','${パス}',{クエリ(Map)}));
//post通信の場合
http.post(Uri.https('${ドメイン}','${パス}'),body: {クエリ(Map)});
※他にもdelete,putなどもサポートしている。
Modelについて
APIで取得したデータはだいたいJsonである。
このデータをdartで読み取れるようにする箱がModelである。
// Modelの例
class Album {
final int id;
final String title;
final int userId;
Album({required this.id, required this.title, required this.userId});
factory Album.fromJson(Map<String, dynamic> json) {
return Album(
id: json['id'] as int,
title: json['title'] as String,
userId: json['userId'] as int,
);
}
}
[内容]
上記、fromJson
でjsonのデータをModelにセットしている。
httpからはString形式でJsonが返却されるのだが、これをdartではimport 'dart:convert';
のjsonDecode
にてStringをMap<String, dynamic>に変換できる。
あとは、Mapのキー値を指定しモデルにセットすれば完成だ。
ちなみにJsonがリスト状になっている場合は以下のように記述することで対応可能だ。
json.map<Album>((element) => Album.fromJson(element)).toList()
具体例
import 'dart:convert';
import 'package:http/http.dart' as http;
import 'package:albums_photos/models/albums.dart';
class AlbumsRepository {
Future<Albums> getAlbums() async {
try {
final response =
await http.get(Uri.https('jsonplaceholder.typicode.com', 'albums'));
return Albums.fromJson(jsonDecode(response.body));
} catch (error) {
throw Exception(error.toString());
}
}
}
[内容]
これはHTTP通信で取得したJsonデータをアルバムモデルにセットして、
そのモデルを返却するファンクションである。
今回は、ステータスコードが200じゃない場合や、response.body
の中身が思っていた内容と違う場合も全部Exceptionとして返却しているがresponse.body
を事前に判定する処理をかましたり。
responseがもっている、statusCode
にてHttpステータスの値取得できるので予めそこで判定が可能なので余力あればした方いいだろう。
所感
API通信ができるようになると扱える情報量が増え、できることがかなり広がるのでプログラムが楽しくなる。
これを前述の非同期処理を用いてユーザーに待たせている感なく表示などできればいい感じの処理が描けるようになる気がする。
Discussion