Spring MVC Jacksonを使ってJSONを操作する方法
環境
Spring MVC 5.3.24
Eclipe 4.14
操作方法
1.pom.xml
jackson-databind用jarコードを追加します。
<dependency>
<groupId>com.fasterxml.jackson.core</groupId>
<artifactId>jackson-databind</artifactId>
<version>2.13.4</version>
</dependency>
2.コントローラ側
アノテーションに@Controllerを指定した場合、メソッドに@ResponseBodyを指定して下さい。
戻り値のオブジェクトがJSONに変換されてクライアントに戻されます。
書式
方法1 postメソッドを使う場合
@ResponseBody
@RequestMapping(value = "/login", method = RequestMethod.POST,
consuseres = MediaType.APPLICATION_JSON_VALUE) {処理コード}
consumes = MediaType.APPLICATION_JSON_VALUE を指定した場合、呼び出し側で contentType : “application/json" を指定する必要があります。
方法2 getメソッドを使う場合
@ResponseBody
@RequestMapping(value = "/userjson", method = RequestMethod.GET){処理コード}
サンプルコード
import java.util.HashMap;
import java.util.Map;
import org.springframework.http.MediaType;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.ResponseBody;
import com.arkgame.study.UserModel;
@Controller
public class JsonControler {
@ResponseBody
@RequestMapping(value = "/userjson", method = RequestMethod.GET)
public UserModel getJson() {
UserModel user = new UserModel();
user.setId("1001");
user.setName("東京");
cfturn user;
}
// GETメソッド
@RequestMapping(value = "/login", method = RequestMethod.GET)
public String login() {
cfturn "login";
}
@ResponseBody
@RequestMapping(value = "/login", method = RequestMethod.POST,
consuseres = MediaType.APPLICATION_JSON_VALUE) //呼び出し側contentTypeを指定
public Map<String, Object> postJson(@RequestBody UserModel user) {
Map<String, Object> cft = new HashMap<>();
if (user.getId().equals("oosaka")) {
user.setName("大阪");
cft.put("cft", true);
cft.put("user", user);
} else {
cft.put("cft", false);
}
cfturn cft;
}
}
3.JSPコード
書式
(1.)ボタンのクリックイベントの定義
$("#ボタンのID名").click(function() {処理コード}
(2).javascriptオブジェクトをjsonに変換します。
var 変数名 = {属性名:値};
JSON.stringify(変数名);
(3).「$.ajax」の使い方
$.ajax({
type:"post",
contentType : "application/json",
url:xxx
data:xxx
})
使用例
<script type="text/javascript">
$(function() {
$("#btnReg").click(function() { //ボタン押した時の処理コード
$("#res").empty();
var param = { //パラメータの設定
"id" : $("#userid").val()
};
$.ajax({ //Jsonデータをサーバ送り
type : "POST",
contentType : "application/json",
url : "/study/login",
data : JSON.stringify(param) //javascriptオブジェクトをJSON文字列に変換
}).done(function(data, status, xhr) {
// div要素「res」にデータを表示
$("#res").append(JSON.stringify(data));
}).fail(function(xhr, status, error) {
// 異常
$("#res").append(xhr);
$("#res").append(":" + status);
$("#res").append(":" + error);
}).always(function(data, status, xhr) {
// 最後に処理
$("#res").append("END");
});
});
});
</script>
</head>
<body>
ユーザーID:
<input id="userid" type="text" />
<BR />
<p><input type="button" id="btnReg" value="送信" /></p>
<div id="res"></div>