JavaのWebアプリケーション開発フレームワークによる、Webサイト開発の顛末記です。

EclipseのMavenを使った、Spring-MVC、Thymeleaf、MyBatis 等のプログラミングテクニックを、
備忘録的に記録しています。実際に動くソースコードを多用して説明していますので、
これからEclipseや、Spring-MVCを始めたいと思っている人にとって、少しでも参考になれば幸いです。
■JSONぶらり旅 @RestControllerによるJSON形式の受信
2ー1)コントローラ作成
次に、JSONグラフデータを生成するためのJava側のプログラムですが
色々作成しなくてはならないクラスがわんさかあるので、一気に説明します。
あとで、計画マップ/プログラム一覧と照らし合わせて見てください。

まず、コントローラクラス。
このコントローラクラスはviewからのJSON形式のリクエストパラメータを受けるために、
クラスに、@RestControllerを宣言します。
@RestControllerは一般的にJSONやXML形式のパラメータを扱うために用意されているアノテーションです。
src/main/java/jp/dip/arimodoki/cntl/DoughnutChart.java
■@RestControllerでviewを返す
話の順番が少し逆転してしまいますが、DoughnutChart.javaの最初のリクエストメソッド、doughnutchart()は
最初の画面を表示するためだけのメソッドです。
通常の@Controllerアノテーションであれば、return view名; を指定すればviewが表示されますが、
@RestControllerの戻り値は通常、JSONやXML形式の文字列を返すので、
そのままではview名を返却することができません。
解決方法としては、
 ・最初のページを表示するクラスを分けて、こちらは@Controllerアノテーションで制御する。
 ・@RestControllerでviewを返せるように工夫する。⇒ ModelAndView を使う。
あたりが考えられます。
今回は後者の方法を採用してみます。(理由は、このためにわざわざクラスを分けたくない)
実装方法としては、メソッドの戻り値を ModelAndView 型にして、
return new ModelAndView("view名");
を返すようにしてやれば、@RestControllerでも viewが表示できるようになります。

■JSONに日本語が入る場合の注意点
重要なのが、2番目のリクエストメソッド doughnutchartdraw() です。
@RequestMappingアノテーションの引数に、produces = MediaType.APPLICATION_JSON_UTF8_VALUE
という引数が追加されていますが、これを指定しておかないと
レスポンスJSONデータ中に日本語が存在すると文字化けしてしまいます。
(produces = "text/html;charset=UTF-8" でも可)
この引数を追加することによって、リクエストパターンの指定方法によっては
ブラウザに406エラーが返ることがあります。
これは、本編「4-2)Spring-MVC設定」でも少し説明しましたが
Spring-MVC3.2以降から、<mvc:annotation-driven /> のContentNegotiationManager機能がデフォルトでONとなり
リクエストパターンの指定と、HTTPヘッダのメディアタイプの組み合わせチェックで406を返す場合があるみたいです。
このjLaboプロジェクトのリクエストパターンは *.xhtml にしていますが
実際、このパターンでは ContentNegotiationManagerをOFFにしないと、406が返りました。
詳しくは、「4-2)Spring-MVC設定」の
「applicationContext.xml」を見てください。

■@RequestBodyでリクエストパラメータを受け取る
doughnutchartdraw()の引数、@RequestBody String jParam でviewからリクエストされたJSONパラメータを受け取ります。
今回の場合はごく単純なリクエストJSONで {"category":"0"} Or {"category":"1"} が渡されます。
0:は果物、1:は肉類
ただし、URLエンコードされた形で受信するので、コンバータjsonConvert.decode()で一旦デコードします。
デコードされたJSON形式文字列は、そのままではJavaで扱いにくいので、
コンバータjsonConvert.Deserialize()で、JavaObject形式にデシリアライズ(並列化)します。
デシリアライズしたObjectをフォームBeanのリクエストパラメータプロパティにセットして、
ビジネスロジックのグラフデータ生成メソッドgetCharDoughnutData()を呼び出します。
ビジネスロジックで生成されたグラフデータObjectをコンバータjsonConvert.Serialize()で
シリアライズ(直列化)してJSON形式文字列に変換し、これをviewに返却します。

 

2-2)JSONコンバータ作成
JSON形式の文字列とJavaオブジェクトの相互変換を行うコンバータクラスを作成します、
Google Gson プラグインを利用しています。
src/main/java/jp/dip/arimodoki/common/JsonConvert.java
内容的には、URLデコード処理と、Gsonのコンバート処理をラップしただけのクラスで
プログラム一覧に書いた通りで、特別に説明する内容はありません。
同階層にインターフェースJsonConvertIf.javaが必要ですが、
Eclipseの「インターフェース抽出」で自動生成できるので、ここでは割愛します。

 

2-3)リクエストパラメータ格納Bean作成
viewから渡されたJSONリクエストパラメータを、
JsonコンバータでJavaObjectに変換した値を格納するBeanです。
src/main/java/jp/dip/arimodoki/model/JsonReqParam.java
内容的には、viewのセレクトボックス選択値 category が一つだけの単純なパラメータ格納クラスです。
同階層にインターフェースJsonReqParamIf.javaが必要ですが、
Eclipseの「インターフェース抽出」で自動生成できるので、ここでは割愛します。

 

2-4)フォームBean作成
コントローラとビジネスロジック間のデータ受け渡しを行うフォームBeanクラスです。
src/main/java/jp/dip/arimodoki/model/FormChart.java
viewからリクエストされた、リクエストパラメータBeanと、
ビジネスロジックにより生成される、グラフデータオブジェクトを管理します。
同階層にインターフェースFormChartIf.javaが必要ですが、
Eclipseの「インターフェース抽出」で自動生成できるので、ここでは割愛します。

 

2-5)グラフデータ作成ビジネスロジック(モック)作成
グラフデータを作成するためのビジネスロジッククラスです。
src/main/java/jp/dip/arimodoki/blogic/BlChart.java
本来では、リクエストパラメータを元にDBからデータを検索したりするのですが
今回は、サンプルということで、クラス内に固定でグラフデータを埋め込んだ
モッククラスとなっています。ソース先頭当たりでstaticな固定データを宣言しています。
同階層にインターフェースBlChartIf.javaが必要ですが、
Eclipseの「インターフェース抽出」で自動生成できるので、ここでは割愛します。

 

2-6)グラフデータセット格納Bean作成
ドーナツグラフの描画情報を保持するデータBeanです。

src/main/java/jp/dip/arimodoki/model/data/ChartDoughnutDataSet.java
data:グラフを描画するデータ値の配列です
backgroundColor:グラフの背景色の配列です。
hoverBackgroundColor:グラフ上でmouseoverした時のハイライト色の配列です。

 

2-7)グラフ描画情報返却用Beanクラス
viewに返却するJSON形式にシリアライズするための最終的なJavaObject構造を持つ
Beanクラスです。
src/main/java/jp/dip/arimodoki/model/data/ChartDoughnutData.java
labels:グラフのラベル名称の配列です。
datasets:グラフdatasets情報格納Beanクラスの配列です。
もう一度おさらい。
これらのクラスを使って、最終的に以下のようなドーナツグラフ用JSON形式データを作り上げます。

 //グラフデータサンプルフォーマット
 var chartData = {
  //グラフのラベル情報
  labels: [
   "Red",
   "Green",
   "Yellow"
  ],
  //グラフのデータセット
  datasets: [
   {
    //グラフのデータ値
    data: [300, 50, 100],
    //グラフの背景色
    backgroundColor: [
     "#FF6384",
     "#36A2EB",
     "#FFCE56"
    ],
    //onmouseover時のグラフの背景色
    hoverBackgroundColor: [
     "#FF6384",
     "#36A2EB",
     "#FFCE56"
    ]
   }]
 };

 

いかがでしたか?
Spring-MVCによるJSONフォーマットの取り扱い方
もっと何か適材適所な使い方がないか、色々勉強中です。