功能分析
注册的后台功能代码
编写UserService 的register测试逻辑
- TestUserService
@Test
public void test03(){
UserService userService = new UserService();
User user = new User();
user.setUsername("jackrock");
user.setPassword("12345678");
user.setStatus("Y");
int code = userService.register(user);
System.out.println(code);
}
编写UserService的register方法
public int register(User user) {
UserDao userDao = MySessionUtils2.getMapper(UserDao.class);
//判断 用户的账号是否存在
User user2 = userDao.findByUserName(user.getUsername());
//不存在，调用保存 返回 1
if (user2 == null) {
userDao.save(user2);
return 1;
} else {
//存在，返回-1
return -1;
}
}
编写UserDao的方法
- 测试
@Test
public void test() {
UserDao dao = MySessionUtils2.getMapper(UserDao.class);
User user= new User(31,"cindy122","12345678",new Date(),"jack","男","3333","[email protected]","N","o");
// User(int uid, String username, String password, Date birthday, String name, String sex, String telephone, String email, char status, String code)
dao.save(user);
//MySessionUtils2.commitAndClose();
}
UserDao
public interface UserDao {
User findByUserName(String name);
User findByName(String username);
void save(User user2);
}
UserDao.xml
<select id="findByUserName" parameterType="String" resultType="user">
select * from tab_user where username = #{username}
</select>
<insert id="save" parameterType="user" >
insert into tab_user values(null,#{username},
#{password},#{name},#{birthday},#{sex},#{telephone},#{email},#{status},#{code})
</insert>
前台代码
register.jsp
- 实际项目中数据的格式都是在浏览器校验，why?
提升用户体验，并减轻服务器压力。 - 校验用户名 /^\w{8,20}$/ 单词字符，长度8到20位
- 校验密码 /^\w{8,20}$/ 单词字符，长度8到20位
- 校验邮箱 = /^\w+@\w+.\w+$/ 邮箱 [email protected]
正则表达式
正则表达式.test(字符串)
返回一个布尔值
true 格式正确
false 格式错误
<script type="text/javascript" >
function checkUsername(){
//判断一下账号输入是否合法
var username = $("#username").val();
var reg = /^\w{8,20}$/ ;
var flag = reg.test(username);
if(flag){
//不提示
$("#username").css("border","");
}else{
//提示
$("#username").css("border","1px solid red");
}
return flag;
}
function checkPassword(){
//判断一下密码输入是否合法
var password = $("#password").val();
var reg = /^\w{8,20}$/ ;
var flag = reg.test(password);
if(flag){
//不提示
$("#password").css("border","");
}else{
//提示
$("#password").css("border","1px solid red");
}
return flag;
}
function checkEmail(){
//判断一下密码输入是否合法
var email = $("#email").val();
var reg = /^\w+@\w+\.\w+$/ ;
var flag = reg.test(email);
if(flag){
//不提示
$("#email").css("border","");
}else{
//提示
$("#email").css("border","1px solid red");
}
return flag;
}
$(function () {
//账号密码 手机号 邮箱 正则判断
//格式正确不作提示，如果错误将边框改成红色
$("#username").blur(checkUsername)
$("#password").blur(checkPassword)
$("#email").blur(checkEmail)
$("#registerForm").submit(function () {
//ajax提交
return false;
})
});
</script>
注册前台Ajax请求
- submit函数
控制表单是否提交，函数返回true，表单提交，返回false表单不提交
此处
在ajax提交，则写false - 为什么返回false?那数据如何到服务端？
ajax提交 - register.jsp
$("#registerForm").submit(function () {
//ajax提交
if(checkUsername()&&checkPassword()&&checkEmail()){
//使用jquery
$.post("registerServlet",$("#registerForm"). serialize(),
function(data){
//{code:1,data:成功}
if(1 == data.code){
//注册成功
window.location = "login.jsp";
}else{
//注册失败
$("#errorMsg").html(data.data);
}
},"json");
}
return false;
})
编写后台RegisterServlet以及验证码验证
@WebServlet("/registerServlet")
public class RegisterServlet extends HttpServlet {
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
doGet(request,response);
}
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
//从请求中获取check1码
String check1 = request.getParameter("check");
//从session中获取check2码
String check2 = (String) request.getSession().getAttribute("CHECKCODE_SERVER");
System.out.println(check1);
System.out.println(check2);
//从session中删除check2码
request.getSession().removeAttribute("CHECKCODE_SERVER");
//比较check1 与 check2
//相同表示验证码不正确，将提示信息写到页面的错误提示
if(check1 == null || !check1.equalsIgnoreCase(check2)){
//验证码不看大小写
ResponseInfo responseInfo = new ResponseInfo();
responseInfo.setCode(-4);
responseInfo.setData("注册失败，验证码出错");
//json
String json = new ObjectMapper().writeValueAsString(responseInfo);
response.getWriter().println(json);
return;
}
//接受请求，获取参数
Map<String,String[]> map = request.getParameterMap();
User user = new User();
//将请求中的参数赋值给变量
try {
BeanUtils.populate(user,map);
} catch (IllegalAccessException e) {
e.printStackTrace();
} catch (InvocationTargetException e) {
e.printStackTrace();
}
//对参数处理
UserService userService = new UserService();
int code = userService.register(user);
//响应给浏览器
ResponseInfo responseInfo = new ResponseInfo();
responseInfo.setCode(code);
if(code == 1){
responseInfo.setData("注册成功");
}else{
responseInfo.setData("注册失败");
}
String json = new ObjectMapper().writeValueAsString(responseInfo);
response.getWriter().println(json);
}
}