Flutter開発のJSON解析

JSON形式のデータインタラクションについては、よく知られていることではないでしょうか.JSON(全称JavaScript Object Notation,JSオブジェクトスペクトル)は軽量レベルのデータ交換フォーマットであり、JSONは人が読みやすく、書きやすいと同時に機械の解析と生成が容易であり、ネットワーク伝送効率を効果的に向上させるなどの特性を有するため、通常、クライアント側とサービス側のデータインタラクションに用いられる.
JSONの基本的な知識については、本文では詳しく紹介しないで、読者は自分で資料を検索して勉強することができます.
手動解析
手動解析は、通常、データ構造が複雑でないシーンに適用されるが、手動解析JSONとは、Flutterが提供するdart:convertに内蔵されたJSONデコーダを指す.元のJSON文字列をjsonに渡すことができる.decode()メソッドは、返されたMapで必要な値を検索します.サードパーティ製ライブラリに依存する必要はなく、小さなプロジェクトに便利です.
たとえば、次のインタフェースがあります.https://jsonplaceholder.typic...を選択します.

{
  "userId": 1,
  "id": 1,
  "title": "sunt aut facere repellat provident occaecati excepturi optio reprehenderit",
  "body": "quia et suscipit
suscipit recusandae consequuntur expedita et cum
reprehenderit molestiae ut ut quas totam
nostrum rerum est autem sunt rem eveniet architecto"
}

上記のデータフォーマットは比較的簡単であるため,手動解析を用いて解析することができる.

final responseJson = json.decode(response.body);
Map newTitle = responseJson ;
print(newTitle['title']);//  title  

もちろん、エンティティクラスを新規作成し、エンティティクラスに解析することもできます.

final responseJson = json.decode(response.body);
print(responseJson.toString());
Post postBean = Post.fromJson(responseJson);    //Post    

データ構造が複雑でない場合はfromJsonを用いてフィールドを解析するのがよいが,データ構造が複雑であれば手書きfromJson,toJsonはあまり友好的ではなく,誤りやすい.
ツールによる解析
Androidのオリジナル開発では、Gson、FastJsonなどのサードパーティ製ライブラリを使用して、JSONデータをエンティティクラスに変換することができます.同様に、Flutter開発では、プラグインまたはツールを使用してエンティティクラスを一クリックで生成することもできます.
例えば、以下は、豆弁映画が提供する映画リストを取得するインタフェースであり、データが返されるフォーマットは以下の通りである.

{
count: 10,
start: 25,
total: 250,
subjects: [
{
rating: {
max: 10,
average: 9.1,
details: {

},
stars: "45",
min: 0
},
genres: [
"  ",
"  ",
"  "
],
title: "   ：    ",
casts: [
{
avatars: {
small: "http://img1.doubanio.com/view/celebrity/s_ratio_celebrity/public/p1004.webp",
large: "http://img1.doubanio.com/view/celebrity/s_ratio_celebrity/public/p1004.webp",
medium: "http://img1.doubanio.com/view/celebrity/s_ratio_celebrity/public/p1004.webp"
},
name_en: "Christian Bale",
name: "     ·  ",
alt: "https://movie.douban.com/celebrity/1005773/",
id: "1005773"
},
{
avatars: {
small: "http://img1.doubanio.com/view/celebrity/s_ratio_celebrity/public/p13801.webp",
large: "http://img1.doubanio.com/view/celebrity/s_ratio_celebrity/public/p13801.webp",
medium: "http://img1.doubanio.com/view/celebrity/s_ratio_celebrity/public/p13801.webp"
},
name_en: "Heath Ledger",
name: "  ·  ",
alt: "https://movie.douban.com/celebrity/1006957/",
id: "1006957"
},
{
avatars: {
small: "http://img1.doubanio.com/view/celebrity/s_ratio_celebrity/public/p522.webp",
large: "http://img1.doubanio.com/view/celebrity/s_ratio_celebrity/public/p522.webp",
medium: "http://img1.doubanio.com/view/celebrity/s_ratio_celebrity/public/p522.webp"
},
name_en: "Aaron Eckhart",
name: "  ·    ",
alt: "https://movie.douban.com/celebrity/1053577/",
id: "1053577"
}
],
durations: [
"152  "
],
collect_count: 813292,
mainland_pubdate: "",
has_video: true,
original_title: "The Dark Knight",
subtype: "movie",
directors: [
{
avatars: {
small: "http://img1.doubanio.com/view/celebrity/s_ratio_celebrity/public/p673.webp",
large: "http://img1.doubanio.com/view/celebrity/s_ratio_celebrity/public/p673.webp",
medium: "http://img1.doubanio.com/view/celebrity/s_ratio_celebrity/public/p673.webp"
},
name_en: "Christopher Nolan",
name: "     ·  ",
alt: "https://movie.douban.com/celebrity/1054524/",
id: "1054524"
}
],
pubdates: [
"2008-07-14(    )",
"2008-07-18(  )"
],
year: "2008",
images: {
small: "http://img1.doubanio.com/view/photo/s_ratio_poster/public/p462657443.webp",
large: "http://img1.doubanio.com/view/photo/s_ratio_poster/public/p462657443.webp",
medium: "http://img1.doubanio.com/view/photo/s_ratio_poster/public/p462657443.webp"
},
alt: "https://movie.douban.com/subject/1851857/",
id: "1851857"
},
title: "    Top250"
}

fromJson,toJsonを用いて解析を行うと面倒でエラーも発生しやすいので,JSON解析を支援するツールを用いる.
オンライン生成
まず、JSON to Dartを開き、下図のようにします.そして、インタフェースから戻ってきたJSONデータを入力ボックスにコピーし、「Dartクラスの作成」をクリックし、右側に生成したDartコードがあります.次に、Dartエンティティークラスを作成し、上で生成したエンティティークラスコードをコピーします.しかし、私はこの方法でJSON解析を行ったとき、問題に遭遇しました.

Cannot generate dart code. Please check the project caveats.

以下の図:発生の原因について私もよく分からないで、知っていることがあって説明することができます.
FlutterJsonBeanFactoryプラグイン
上記の方法に加えて、FlatterJsonBeanFactoryプラグインを使用してBeanクラスの生成を支援することもできます.FlutterJsonBeanFactoryプラグインをインストールするのは簡単です.Android Studioを例に、「Android Studio」->「Preferences...」->「Plugins」の順に選択し、FlutterJBeanFactoryプラグインを検索してインストールすればいいです.下図のように.インストールに成功したらAndroid Studioを再起動すればいいですが、再起動後はnewの時に【dart bean class File from Json】オプションを1つ追加します.下図のように.次に、プロジェクトのlibディレクトリの下を右クリックし、「new」->「dart bean class File from JSON」を選択して、次の図のようにエンティティクラスを作成します.次に、【Make】ボタンをクリックすると、次の図のようなdartエンティティクラスが生成されます.JSON変換プラグインを用いて開発を支援することは,Flutter開発にとって非常に便利であることが分かる.FlutterJsonBeanFactoryプラグインのほか、もう一つのFlutterJsonHelperはJSONからEntityエンティティーエンティティークラスに変換するタスクを完了することができます.
なお、エンティティクラスを生成する場合、クラス名の後ろのentityは自動的に加算され、以下の図にカスタム名を設定できます.次に、dioライブラリまたはhttpclientを使用してインタフェースを要求し、以下に示すようにmoviesentityエンティティクラスに変換できます.

//      
void getFilmList() async {
    Dio dio = new Dio();
    Response response=await dio.get(hotMovies);
    print('    ：'+response.toString());

    Map userMap = json.decode(response.toString());
    var movies = new MoviesEntity.fromJson(userMap);
  }