SSM框架前后端信息交互实现流程详解

2023-07-20 15:42:03 175

一、从前端向后端传送数据

常见的3种方式

1、form表单的action：此方法可以提交form表单内的输入数据，也可同时提交某些隐藏但设置有默认值的，如修改问题时，我们除了提交问题的相关信息，还需要将用户的编号提交给后端，此时就可以设置一个默认值为用户编号的,并将其隐藏

1/Question/DisplayQuestionInfo?question_id=${question.question_id}"rel="externalnofollow">${question.question_title}
比如该处代码，显示了问题的标题信息，并将其作为超链接，点击该链接时进入后端Controller类的方法，并向其发送问题编号question_id

3、ajax请求：此方法一般在不需要页面跳转时采用，可以局部刷新页面，比如向后端提交关注某用户的信息，后端收到ajax的请求数据，对数据库进行操作，并通过@Response注解返回信息给前端，然后前端进行相关操作，可以不进行页面跳转

前端部分代码


......
functionSaveUserFollowUser(){
varlogin_user_id=${login_user_id}//登录者（发起者）编号
varuser_id=${user.user_id};//接受者用户编号

$.ajax({
url:"<%=path%>/UserRelation/SaveUserFollowUser",
type:"POST",
async:false,
contentType:"application/json;charset=UTF-8",
dataType:'json',

data:JSON.stringify({"from_user_id":login_user_id,"to_user_id":user_id}),//JSON对象转为字符串
success:function(data){
/*可在后端增加判断发起者和接受者用户是否是同一用户的判断*/
if(data==true){
alert("关注成功");
}else{
alert("您已经关注该用户，不可重复关注")
}
}
});
}


......
关注用户
......

后端Controller类

/**
*表现层用户关系相关(关注用户、被用户关注、关注问题、赞同回答)
*/
@Controller
@RequestMapping("/UserRelation")
publicclassUserRelationController{

......

/**
*新增某用户关注某用户
*@parammap
*@return
*/
@RequestMapping(value="/SaveUserFollowUser",method={RequestMethod.POST})
public@ResponseBodyBooleanSaveUserFollowUser(@RequestBodyMapmap){

//关注发出者编号
Integerfrom_user_id=Integer.parseInt(map.get("from_user_id"));
//关注接受者编号
Integerto_user_id=Integer.parseInt(map.get("to_user_id"));
//是否新增成功
//该项可以增加发起者用户和接受者用户是否是同一用户的判断，即比较from_user_id与to_user_id是否相等，如果相等则关注失败
//通过返回Integer类型而非Boolean类型的做判断本程序并未增加这项判断
Booleanflag=userRelationService.saveUserFollowUser(from_user_id,to_user_id);
returnflag;
}
......
}

二、从后端向前端传送数据

1、Model

后端部分代码

/**
*表现层用户
*/
@Controller
@RequestMapping(value="/User")
publicclassUserController{

......

/**
*进入个人信息页面
*@paramhttpSession
*@parammodel
*@return
*/
@RequestMapping(value="/DisplayMyInfo")
publicStringDisplayMyInfo(HttpSessionhttpSession,Modelmodel){
Integeruser_id=(Integer)httpSession.getAttribute("login_user_id");//登录者个人编号
Useruser=userService.findUserById(user_id);//登录者个人信息

model.addAttribute("user",user);//将登录者个人信息返回给前端
return"User/myInfo";
}
......
}

前端部分代码

......

用户名:${user.user_name}
用户昵称:${user.user_nickname}
用户性别:${user.user_sex}
用户邮箱:${user.user_email}
用户密码:${user.user_password}

......

此时可以通过${}直接取得后端传来的数据

2、ModelAndView

该方法与Model相比，多增加了返回的视图（View），对于返回给前端的具体数据处理类似

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持毛票票。

声明：本文内容来源于网络，版权归原作者所有，内容由互联网用户自发贡献自行上传，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任。如果您发现有涉嫌版权的内容，欢迎发送邮件至：czq8825#qq.com（发邮件时，请将#更换为@）进行举报，并提供相关证据，一经查实，本站将立刻删除涉嫌侵权内容。

SSM框架前后端信息交互实现流程详解

用户名:${user.user_name}

用户昵称:${user.user_nickname}

用户性别:${user.user_sex}

用户邮箱:${user.user_email}

用户密码:${user.user_password}

热门推荐

随机推荐