🌟

JSONデータをオブジェクト化して選択リストに表示させる

2024/03/11に公開

はじめに

APIで取得した地方・都道府県の値をJSONで取得した。
その値を画面に表示させたいのだが、JSON形式のまま出力はできないはずなので、
Javaオブジェクトに変換して、それをmodel.addAttributeで出力させるようにしたい。
今回はその方法を備忘録として残しておく。

この記事でわかること

  1. JSONで取得した値をJavaオブジェクトに変換する
  2. オブジェクトの値を選択リストに出力する

完成イメージ


JSONの値をオブジェクトに変換する。
オブジェクトの値を選択リストに表示させることができる。

手順

①APIからJSONデータを取得して、JSON文字列に変換する。

controller

OkHttpClient areaClient = new OkHttpClient();
		String areaUrl = "https://webservice.recruit.co.jp/hotpepper/large_area/v1/?key=" + "APIキー" + "&format=json";
		Request areaRequest = new Request.Builder()
		       .url(areaUrl)
		       .build();
		Response areaResponse = areaClient.newCall(areaRequest).execute(); 
		String areaJsonStr = areaResponse.body().string();

②JSON文字列からJavaオブジェクトへ変換(パース)するためにObjectMapperをインスタンス生成する

こいつは過去に触ったことがある。
readTreeメソッドを使ってJSON文字列からJsonNodeへパースしたな。
Json文字列をあれやこれやとパースするためのクラスらしい。

Object Mapperとは
それでははじめに言葉の定義からです。 Object Mapperとはそもそも何なのか、この機会に調べてみました。 まずは公式ドキュメントからです。
ObjectMapperは、基本的なPOJO(Plain Old Java Objects)との間、または汎用JSONツリーモデル(JsonNode)との間でJSONを読み書きするための機能と、変換を実行するための関連機能を提供します。また、さまざまなスタイルのJSONコンテンツを処理し、ポリモーフィズムやオブジェクトIDなどのより高度なオブジェクトの概念をサポートするように高度にカスタマイズできます。 公式ドキュメントより
簡単に噛み砕くと、 JacksonのObjectMapperはJavaのObjectとJson間の変換を簡単にしてくれるクラスです。

引用元:
https://tech.excite.co.jp/entry/2021/12/22/163906

JsonNodeへパースした時の記事はこちら
https://zenn.dev/gonchan/articles/4f464c765068a5

③変換する前に変換対象のクラスを作成する

{
  "results": {
    "api_version": "1.30",
    "results_available": 47,
    "results_returned": "47",
    "results_start": 1,
    "large_area": [
      {
        "code": "Z011",
        "name": "東京",
        "service_area": {
          "code": "SA11",
          "name": "東京"
        },
        "large_service_area": {
          "code": "SS10",
          "name": "関東"
        }
      },
      {
        "code": "Z012",
        "name": "神奈川",
        "service_area": {
          "code": "SA12",
          "name": "神奈川"
        },
        "large_service_area": {
          "code": "SS10",
          "name": "関東"
        }
      },
      {
        "code": "Z013",
        "name": "埼玉",
        "service_area": {
          "code": "SA13",
          "name": "埼玉"
        },
        "large_service_area": {
          "code": "SS10",
          "name": "関東"
        }
      }
    ]
  }
}

それぞれのデータをフィールドとして扱いたいので、以下のクラスを作る
ApiResponse.java

@JsonIgnoreProperties(ignoreUnknown = true)
@Data
public class ApiResponse {
    private Results results;
}

@Data
class Results {
    @JsonProperty("api_version")
    private String apiVersion;
    @JsonProperty("results_available")
    private int resultsAvailable;
    @JsonProperty("results_returned")
    private String resultsReturned;
    @JsonProperty("results_start")
    private int resultsStart;
    @JsonProperty("large_area")
    private List<LargeArea> largeArea;
}

@Data
class LargeArea {
    private String code;
    private String name;
    @JsonProperty("service_area")
    private ServiceArea serviceArea;
    @JsonProperty("large_service_area")
    private LargeServiceArea largeServiceArea;
}

@Data
class ServiceArea {
    private String code;
    private String name;
}

@Data
class LargeServiceArea {
    private String code;
    private String name;
}

@JsonProperty("large_service_area")はJsonのkeyとフィールドを紐づけるために記載するもの。
詳しくはこちらの記事にありました。
https://qiita.com/niwasawa/items/80c3c3b1148be67b09d1

④変換する

controller

ApiResponse response = mapper.readValue(areaJsonStr, ApiResponse.class);

readValueを使って、変換したいJSON文字列をJavaのオブジェクト形式に変換した。

⑤変換したオブジェクトをmodelオブジェクトにセット(addAttribute)する

controller

model.addAttribute("apiResponse", response);

⑥html側で出力する

<select>
    <option th:each="area : ${apiResponse.results.largeArea}"
            th:value="${area.code}"
            th:text="${area.name}">Area Name
    </option>
</select>

確認


できました。

Discussion