SpringMVC × jQuery Ajax × iOS Chromeでエラーになる件の解決方法
他のブラウザでは問題ないのだけれども、iOSのChromeだけでjQueryのajaxがエラーになる件で苦しんだのでメモ。
記事をいろいろ漁っても大体「iOSのChromeは捨てろ」なんてことが書かれており、個人的にiPhoneでもChrome使いたい自分にとってとても困った。
まず、クライアント側のajaxのソースコードとしては以下のように単純。
var param = { type : 'POST', url : 'hoge/put-hoge', contentType : 'application/json; charset=utf-8', data : JSON.stringify({ param1 : 'aaa', param2 : 'bbb', }), }; $.ajax(param).done(function(receiveData, textStatus, jqXHR) { console.log(receiveData); }).fail(function(jqXHR, textStatus, errorThrown) { var message = 'status"=' + jqXHR.status + '", textStatus="' + textStatus + '", errorThrown="' + errorThrown + '"'; alert(message); });
そして、サーバーサイドのメソッドは以下のように
@RequestMapping(value = "hoge/put-hoge", method = RequestMethod.POST) @ResponseBody public String putHoge(@RequestBody Map<String, String> param) { String param1 = param.get("param1"); String param2 = param.get("param2"); // この辺でパラメータ使ってDBに書き込み return "success"; }
とまぁこちらも簡単にDBにこにょこにょして、文字列を返すだけなのだが、これがiOSのChromeだけ上手くいかない。。
エラーの内容も、
status="0", textStatus="error", errorThrown=""
と、もう「何かしら起こりましたが何かしらダメです。何かは教えません。」て感じでクソ。
サーバーサイドではエラーは起こっていない。平然と「仕事しましたが何か?」って感じでこちらもクソ。
他のiOSのSafariやAndroidのChromeでは全然行けるのに。。
問題は、サーバーサイドのメソッドアノテーションの記載が足りなかったことだった!
つまり、上記サーバーサイドのコードを
@RequestMapping(value = "hoge/put-hoge", method = RequestMethod.POST, produces = MediaType.TEXT_PLAIN_VALUE)
と、produceを追記してやればOK。
殆どのブラウザがレスポンスのメディアタイプを自動判別してくれてたってことなのかね。
記述が長くなるが、つけといた方がいいってことで了解しました。