题目:写一个ajax请求,去后台取一个整数,并显示到页面文本框中。要求该整数值1秒钟刷新1次。
原因:服务端返回值类型与ajax回调函数返回值类型不一致
分析如下:
前台:
1 $(document).ready(function(){ 2 setInterval("getVal()",1000); //1秒钟刷新一次 3 }); 4 function getVal(){ 5 $.post("/TestServlet/random",{}, function(resultObj){ 6 alert(1); 7 }, "json"); 8 }
后台:
response.setContentType("text/html;charset=utf-8"); try { response.getWriter().write("{'val':"+new java.util.Random().nextInt(900)+"}"); response.getWriter().flush(); response.getWriter().close(); } catch (IOException e) { e.printStackTrace(); }
代码大至如上,服务端有返回值,http status为200,按道理来说处理已经正常结束了,但就是不走回调函数。后来使用全参的ajax请求,确实出现了"调用ajax请求出错"的提示。
$.ajax({ type:"post", url:"/TestServlet/random", data:null, dataType:"text", beforeSend: function(XMLHttpRequest){}, success:function(data){alert(data["operateMessage"]);}, complete:function(XMLHttpRequest,textStatus){}, error:function(message){ alert("调用ajax请求出错"); alert(message);} });
再经过断点查看详细,发现返回值类型指定错误。服务端返回的mime类型为"text/html",而回调函数指定的为"json",修改代码如下,问题解决:
$(document).ready(function(){ setInterval("getVal()",1000); //1秒钟刷新一次 }); function getVal(){ $.post("/TestServlet/random",{}, function(resultObj){ alert(1); }, "text"); //就是这里的类型与服务端指定不匹配,造成ajax请求出错。如果想在服务端返回json类型,请到<%tomcat%>confweb.xml文件中寻找json对应的MIME类型,并在服务端指定即可。 }