jQuery – Ajaxリクエストは200 OKを返しますが、エラーイベントは発生しますか?
jQuery Ajaxフォームの提出を確認してください。
$(document).ready(function () {
$("#hostingForm").submit(function (e) {
e.preventDefault(e);
var data = {}
data["id"]= $("#id").val();
data["domain"]= $("#domain").val();
data["name"]= $("#name").val();
//...
$.ajax({
type: "POST",
contentType: "application/json",
url: "{{home}}/hosting/update",
data: JSON.stringify(data),
dataType: 'json',
timeout: 600000,
success: function (data) {
console.log("SUCCESS: ", data);
},
error: function (e) {
console.log("ERROR: ", e);
}
});
});
});
Ajaxリクエストを受け取るには、サーバー側(Spring MVC)を確認してください。
@RestController
@RequestMapping("/hosting")
public class AdminHostingController {
@Autowired
HostingBo hostingBo;
@RequestMapping(value = "/update", method = RequestMethod.POST)
public String updateHosting(@RequestBody HostingForm hostingForm) {
if(hostingForm!=null){
hostingBo.update(hostingForm, UpdatedBy.WEB);
}
return "success";
}
上記の春のMVCコードは正常に動作しており、データベースを更新して「成功」文字列を返します。
1.問題
クライアント側(jQuery Ajaxフォーム提出)とサーバー側(Spring MVC)の両方が問題なく動作していますが、Ajaxエラーイベントが発生していますか?
ブラウザコンソールで次の出力を参照してください。
ERROR: Object {readyState: 4, responseText: "success", status: 200, statusText: "OK"}
200 OKですが、エラーイベントが発生しましたか?
2.解決策
jQuery `.ajax()`では、 `dataType: ‘json’`設定が指定されている場合、サーバーは有効なJSON形式のStringを返さなければなりません。そうでなければエラーがスローされます。
“… JSONデータは厳密に解析されます。不正な形式のJSONはすべて拒否され、解析エラーがスローされます… ”
-
これを修正するには、JSON形式の文字列を返すようにサーバー側を更新します。
@RestController
@RequestMapping("/hosting")
public class AdminHostingController {
@Autowired
HostingBo hostingBo;
@RequestMapping(value = "/update", method = RequestMethod.POST)
public String updateHosting(@RequestBody HostingForm hostingForm) {
if(hostingForm!=null){
hostingBo.update(hostingForm, UpdatedBy.WEB);
}
//NEED JSON format
return "{\"msg\":\"success\"}";
//return "success";
}
もう一度やり直し、ブラウザのコンソールをもう一度見直し、「成功」イベントが発生します。
SUCCESS: Object {msg: "success"}
参考文献
-
リンク://spring-mvc/spring-3-mvc-and-json-example/[Spring MVCとJSON]