JavaWeb前端如何获取后端响应的数据并作处理(ajax+fastjson) |
您所在的位置:网站首页 › 前端如何获取数据库信息的方法 › JavaWeb前端如何获取后端响应的数据并作处理(ajax+fastjson) |
一切问题的起源在于我需要向数据库里拿信息,并且动态更新在当前网页中。这句话虽然短,但是却要做相当量的处理。 首先仅仅使用jsp是不行的,说实在java代码我觉得就不应该多写在html网页中,他和html代码和js代码是不能相互处理赋值的,只能各显示各的,所以不能通过java代码在jsp页面直接获取数据的数据。想要不刷新页面而且动态的更新页面的数据,还是需要ajax。 这里我使用了jquery的ajax,基本上用的都是post,即 $.post("Servlet", { "param":value }, function (data, status) { })post方法有三个参数: 第一个是url,像web项目第一个一般就是某个Servlet;第二个参数是一个对象,里面放若干个键值对,其中键用字符串,你可以在请求的Servlet中直接使用 ==request.getParameter(“param”) ==来获取传过来的参数,默认为字符串;第三个参数是回调函数,指请求成功后执行的操作,data和status是默认的参数,前者是后端响应的数据==(字符串)==,后者是状态信息。我们可以在Servlet的doGet/doPost方法的最后写上: response.setCharacterEncoding("UTF-8"); response.getWriter().append(String);这样,就可以把后端的字符串传到前端了,在回调函数中对data进行操作。(第一个是设置响应的编码,如果不设置有可能会出现乱码) 那么问题来了,java数组,java字符串和js数组,js字符串是不互通的,之间连接的桥梁就是字符串,还得是json字符串的格式,方便前端解析,所以我们需要将后端的数据转化成json字符串的格式,从前端获取到后再解析为js对象或者数组,当然也可以倒过来操作,这个时候有好几种java数据和json之间相互转化的工具,这里我用了fastjson: 当然首先我们要导入这个jar包;java数组,集合或是对象转化为json字符串的格式一般用到的是fastjson里的JSON类和==JSON.toJSONString(object)=这个方法: import com.alibaba.fastjson.JSON; JSON.toJSONString(object);其中这个方法里的参数你可以放数组,集合或是一个Bean对象(一个实体类对象),这个方法都可以自动转化相应的json字符串格式,不过通常我们会封装一个响应实体类: public class ResponseBean { private Object object; private int status; private String statusMsg; public ResponseBean() {} public ResponseBean(int status, String statusMsg) { super(); this.status = status; this.statusMsg = statusMsg; } public ResponseBean(Object object, int status, String statusMsg) { this.object = object; this.status = status; this.statusMsg = statusMsg; } public Object getObject() { return object; } public int getStatus() { return status; } public String getStatusMsg() { return statusMsg; } public void setObject(Object object) { this.object = object; } public void setStatus(int status) { this.status = status; } public void setStatusMsg(String statusMsg) { this.statusMsg = statusMsg; } @Override public String toString() { return "ResponseBean [object=" + object + ", status=" + status + ", statusMsg=" + statusMsg + "]"; } }我们一般每次在向前端返回数据的时候都会把响应的结果封装为一个对象,再将其转化为json字符串,到前台解析的就是一个js对象,一把来说这个响应实体类包含三个成员变量:响应的数据,响应的状态,响应状态信息,其中java数组,集合或是对象直接赋给成员变量object就行,不需要再转换为字符串再赋值给object,只需要将这个响应实体类转化为json字符串的格式再返回到前台即可。 前端回调函数中的data就是这个对象,当然先要将json字符串进行解析: var response = JSON.parse(data); if(response.status == ){} if(response.object == undefined){} 首先我们可以先根据状态码来判断返回的结果,其次因为构造方法里可以不对object进行赋值,所以在响应的数据为空的时候可以对其判断是否为undefined来进行进一步操作。下面这一点非常重要,ajax请求都是需要时间的,即使是本地也需要,一般来说会慢于正常代码的执行速度,如果你在执行ajax的时候post后面还跟有其他的方法或代码,由于ajax是异步的,你的网页会继续向下执行,导致post后面的代码早于其执行。解决方法一个是尽量不要在post方法后继续写代码(有点极端)另一个可以讲后续代码放在post的回调函数中设置后续代码延迟执行setTimeout或是使用async和awiat关键字(大家可以去了解一下) 当然如果你想把前台的数组或是对象返回给后台进行解析,fastjson也可以做到,不过要使用到JSONArray类: import com.alibaba.fastjson.JSONArray; JSONArray javaList = JSONArray.parseArray(jsonString); // 将js数组转化为java可以识别的集合 //使用方法和list基本一样,size(),get(index) List users2 = JSON.parseArray(jsonString, T.class); //这个方法就是将js对象转化为java中的list集合, //不过要放入响应的实体类基本上就已经完成了前后端数据的交互,如果前端使用了vue就轻松了很多,直接把绑定的data值一更新,页面就也跟着动态更新了;如果没有用就需要用jquery自己手动操作dom了。 |
今日新闻 |
点击排行 |
|
推荐新闻 |
图片新闻 |
|
专题文章 |
CopyRight 2018-2019 实验室设备网 版权所有 win10的实时保护怎么永久关闭 |