servlet使用ajax需要注意的一些事项
使用ajax进行增删改查时get、post方法都能实现其功能。但是出于数据安全性的考虑,数据的添加和修改最好不要使用get方法。当数据量极大的时候,数据的获取也不建议采用get方法。get方法数据传输速度快但不能传大数据,传输不安全,post方法适用于传输大数据,传输速度比get较慢但安全性高。
如:当获取某个实体类集合的时候
function getFacebookList() {
$.ajax({
url:'/back/facebook/facebook',
type:'get',
dataType:'json',
success:function (data) {
$("tbody").html("");
$.each(data,function (i,facebook) {
$("tbody").append("<td><input type='checkbox'></td><td>"+ facebook.id +"</td><td>"+ facebook.title +"</td><td>"+ facebook.email +"</td><td>"+ facebook.date +"</td><td>"+ facebook.content.substring(0,15) +"...</td><td><button οnclick='directNewsDetails("+facebook.id+")'>详情</button><button οnclick='deleteFacebook(" + facebook.id + ")'>删除</button></td>");
})
}
})
}
servlet页面则应是
@WebServlet("/back/facebook/facebookmanage")
public class FacebookManageServlet extends HttpServlet {
IFacebookService facebookService = new FacebookServiceImpl();
@Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
resp.setContentType("text/html;charset=utf-8");
req.setCharacterEncoding("UTF-8");
resp.setCharacterEncoding("UTF-8");
String fid = req.getParameter("id");
int id = 0;
if (!"".equals(fid))
id = Integer.parseInt(fid);
int result = facebookService.deleteFacebook(id);
resp.getWriter().print(result);
}
注意:servlet传的是int、String、boolean等基本类型,则ajax中的dataType属性就设置为text属性。ajax中的dataType是表示的是接受到servlet中resp.getWriter().print(jsonObject)传回来的的值的类型。如果需要接收json类型的数据,则将其属性设置为json,servlet则应是
@WebServlet("/back/facebook/facebook")
public class FacebookServlet extends HttpServlet {
IFacebookService facebookService = new FacebookServiceImpl();
@Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
//留言列表
resp.setContentType("application/json");
req.setCharacterEncoding("UTF-8");
resp.setCharacterEncoding("UTF-8");
List<FacebookModel> list = facebookService.getFacebookList();
JSONObject jsonObject = new JSONObject();
jsonObject.put("facebook",list);
resp.getWriter().print(jsonObject);
}
记得传送json数据一定要用到一个json包并将其数据打包成json类,否则ajax会报错或者得到的是字符串类型数据
接收int类型数据:
servlet代码示例:
@WebServlet("/back/facebook/facebookmanage")
public class FacebookManageServlet extends HttpServlet {
IFacebookService facebookService = new FacebookServiceImpl();
@Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
resp.setContentType("text/html;charset=utf-8");
req.setCharacterEncoding("UTF-8");
resp.setCharacterEncoding("UTF-8");
String fid = req.getParameter("id");
int id = 0;
if (!"".equals(fid))
id = Integer.parseInt(fid);
int result = facebookService.deleteFacebook(id);
resp.getWriter().print(result);
}
ajax代码示例:
function deleteFacebook(id) {
$.ajax({
url: '/back/facebook/facebookmanage',
type: 'get',
data:{"id":id},
dataType: 'text',
success:function (data) {
if (data > 0)
alert("删除成功!");
else
alert("删除异常!");
getFacebookList();
}
})
}
切记一定要在servlet最前面加上
resp.setContentType("text/html;charset=utf-8");
req.setCharacterEncoding("UTF-8");
resp.setCharacterEncoding("UTF-8");
或者
resp.setContentType("application/json");
req.setCharacterEncoding("UTF-8");
resp.setCharacterEncoding("UTF-8");
resp.setContentType中的值根据后台所要接收的对应的数据类型来填写,json类型则填写"application/json",其他则为"text/html;charset=utf-8"。这是因为前后台的编码类型不一样所导致。当然上传文件的好像不一样,只不过dataType比较常用的就是text和json。
如果没有加上的话可能会在浏览器控制台报语法错误,又不显示是在哪一行,而且后台还不会报错就令人很头疼。虽然好像对操作功能的实现没有什么影响,但是当你按F12看到有错误时,作为强迫症患者是非常头大的事。
今天就暂时总结这么多。