猿人工厂君在上一章节已经带着你扫清了小项目的关键内容,小项目的架子算是搭起来了,今天猿人工厂君就带你来完成这个小项目的部分内容。
哈哈,金胖子,你是要逗我吗?如此简单的一个注册页面,有什么好讲的。注册嘛,每个用户填写资料,只要符合一定的校验规则,服务器存储这些信息就可以了。从这个页面上看,用户信息也不算复杂,用户名,密码,email,姓名,手机号,性别,出生日期也就够了。用户点击注册,数据库存储不重复的用户信息就可以了。
嗯,要存储用户信息,自然先定义一个用户类,之前数据库已经设计好了,我们使用SpringJdbcTemplete,要求类的属性满足驼峰式的命名规范,帮助我们方面地以对象的形式操作数据。我们的用户类几乎已经是现成的了。
这样子,用户类暂时定下来了(访问器方法及构造方法省略)。
/** * 用户实体 * @author pangzi * */ public class TravelUser implements Serializable{ private long travelUserId;//用户id private StringtravelUserName;//用户名,账号 private StringtravelUserPassword;//密码 private StringtravelUserRelName;//真实姓名 private StringtravelUserBirthday;//出生日期 private int travelUserSex;//男或女 private StringtravelUserTelephone;//手机号 private StringtravelUserEmail;//邮箱 private int travelUserStatus;//激活状态,1代表激活,0代表未激活 private StringtravelUserCode;//激活码(要求唯一) }
嗯,再看看这个功能,还是存在一些隐藏的业务逻辑,用户名的长度,密码长度,邮箱的基本格式,还有一个最重要的事情,用户名是不能重复的,这个需要根据用户名来检索数据库中的数据,如果已经存在数据了,就要提醒用户换一个用户名了。嗯,好像还遗忘了一个事情,还需要根据激活码来校验用户激活操作是否正确。嗯,脑容量有点不够了,怎么办啊?
重点来了,新手正确的编写SQL确实是一个比较难以回避的话题,select*的各种问题,可以自行度娘,猿人工厂君也不想多费口舌。现在就教你一种简单快捷无错的sql编写办法,好好珍藏吧。
以要操作的travel_user表为例,先在SQLylog中执行语句desc table_name。
然后对着执行结果右键->复制->复制所有行到粘贴板。新建一个excel,将结果粘贴下来:
去掉表头,只留下两列,把第二列输入英文半角的逗号,下拉,快速得到如下结果,注意噢,最后一行没有逗号噢。
然后找一个在线压缩工比如https://www.sojson.com/jshtml.html,将两列复制下来粘贴进去。
然后点击普通压缩,你要查询的字段名就已经好了,复制代码,然后回到SQLyog,编写代码,把需要查询或新增的部分留出来,把查询过滤条件写好。
然后粘贴之前复制的内容稍做调整即可,记得执行下噢,验证下sql的正确性。
如果是写插入语句把select换成insert into 语句,去掉自增的字段(如果有的话),然后只用关心values后边有几个问号就好了^_^
于是我们快速的得到了好用而且规范编写的sql语句:
SELECT
travel_user_id,travel_user_name,travel_user_password,
travel_user_rel_name,travel_user_birthday,
travel_user_sex,travel_user_telephone,travel_user_email,
travel_user_status,travel_user_code
FROM travel_user WHEREtravel_user_name = ?
SELECT
travel_user_id,travel_user_name,travel_user_password,
travel_user_rel_name,travel_user_birthday,
travel_user_sex,travel_user_telephone,travel_user_email,
travel_user_status,travel_user_code
FROM travel_user WHERE travel_user_code= ?
INSERT INTO
travel_user(travel_user_name,travel_user_password,travel_user_rel_name,travel_user_birthday,travel_user_sex,travel_user_telephone,travel_user_email,travel_user_status,travel_user_code)VALUES(?,?,?,?,?,?,?,?,?)
接下来,页面的实现和后端代码的编写就容易多了。接下来由于篇幅有限,猿人工厂君就把功能实现的关键代码奉献给你了。
前端页面脚本实现
function checkUsername() {
//1.获取用户名值
var username = $("#username").val();
//2.定义正则
var reg_username = /^\w{8,20}$/;
//3.判断,给出提示信息
var flag = reg_username.test(username);
if(flag){
//用户名合法
$("#username").css("border","");
}else{
//用户名非法,加一个红色边框
$("#username").css("border","1px solid red");
}
return flag;
}
//校验密码
function checkPassword() {
//1.获取密码值
var password = $("#password").val();
//2.定义正则
var reg_password = /^\w{8,20}$/;
//3.判断,给出提示信息
var flag = reg_password.test(password);
if(flag){
//密码合法
$("#password").css("border","");
}else{
//密码非法,加一个红色边框
$("#password").css("border","1px solid red");
}
return flag;
}
//校验邮箱
function checkEmail(){
//1.获取邮箱
var email = $("#email").val();
//2.定义正则 itcast@163.com
var reg_email = /^\w+@\w+\.\w+$/;
//3.判断
var flag = reg_email.test(email);
if(flag){
$("#email").css("border","");
}else{
$("#email").css("border","1px solid red");
}
return flag;
}
$(function () {
//当表单提交时,调用所有的校验方法
$("#registerForm").submit(function(){
//1.发送数据到服务器
if(checkUsername() && checkPassword()&& checkEmail()){
//校验通过,发送ajax请求,提交表单的数据 username=zhangsan&password=123
$.post("user/regist",$(this).serialize(),function(data){
//处理服务器响应的数据 data {flag:true,errorMsg:"注册失败"}
if(data.flag){
//注册成功,跳转成功页面
location.href="register_ok.html";
}else{
//注册失败,给errorMsg添加提示信息
$("#errorMsg").html(data.errorMsg);
}
});
}
//2.不让页面跳转
return false;
//如果这个方法没有返回值,或者返回为true,则表单提交,如果返回为false,则表单不提交
});
//当某一个组件失去焦点是,调用对应的校验方法
$("#username").blur(checkUsername);
$("#password").blur(checkPassword);
$("#email").blur(checkEmail);
});
后端代码实现
package com.pz.route.dao;
import com.pz.route.domain.TravelUser;
/**
*
* @author pangzi
*
*/
public interface TravelUserDao {
/**
* 根据用户名查询用户信息
* @param travelUserName
* @return
*/
public TravelUser findByTravelUsername(StringtravelUserName);
/**
* 保存用户信息
* @param travelUser
*/
publicvoidsaveTravelUser(TravelUser travelUser);
/**
* 根据激活码查询用户
* @param travelUsercode
* @return
*/
TravelUser findByTravelUserCode(StringtravelUsercode);
/**
* 更新用户状态
* @param travelUser
*/
void updateTravelUserStatus(TravelUsertravelUser);
/**
* 根据用户名和密码查询用户
* @param travelUserName
* @param travelUserPassword
* @return
*/
TravelUser findByUsernameAndPassword(StringtravelUserName, String travelUserPassword);
}
package com.pz.route.dao.impl;
import org.springframework.dao.DataAccessException;
import org.springframework.jdbc.core.BeanPropertyRowMapper;
import org.springframework.jdbc.core.JdbcTemplate;
import com.pz.route.dao.TravelUserDao;
import com.pz.route.domain.TravelUser;
import com.pz.route.util.JDBCUtils;
publicclass TravelUserDaoImpl implements TravelUserDao {
private JdbcTemplate template = newJdbcTemplate(JDBCUtils.getDataSource());
@Override
public TravelUserfindByTravelUsername(String travelUserName) {
TravelUser user = null;
try {
//1.声明sql
String sql = "select * fromtravel_user where travel_user_name = ?";
//2.执行sql
user = template.queryForObject(sql,new BeanPropertyRowMapper<TravelUser>(TravelUser.class), travelUserName);
} catch (Exception e) {
}
return user;
}
@Override
public void saveTravelUser(TravelUsertravelUser) {
//1.声明sql
String sql = "insert intotravel_user(travel_user_name,travel_user_password,travel_user_rel_name,travel_user_birthday,travel_user_sex,travel_user_telephone,travel_user_email,travel_user_status,travel_user_code)values(?,?,?,?,?,?,?,?,?)";
//2.执行sql
template.update(sql,travelUser.getTravelUserName(),
travelUser.getTravelUserPassword(),
travelUser.getTravelUserRelName(),
travelUser.getTravelUserBirthday(),
travelUser.getTravelUserSex(),
travelUser.getTravelUserTelephone(),
travelUser.getTravelUserEmail(),
travelUser.getTravelUserStatus(),
travelUser.getTravelUserCode()
);
}
/**
* 根据激活码查询用户对象
* @param code
* @return
*/
@Override
public TravelUserfindByTravelUserCode(String travelUserCode) {
TravelUser user = null;
try {
String sql = "select * fromtravel_user where travel_user_code = ?";
user = template.queryForObject(sql,newBeanPropertyRowMapper<TravelUser>(TravelUser.class),travelUserCode);
} catch (DataAccessException e) {
e.printStackTrace();
}
return user;
}
/**
* 修改指定用户激活状态
* @param user
*/
@Override
public voidupdateTravelUserStatus(TravelUser travelUser) {
String sql = " update travel_userset status = 1 where travel_user_id=?";
template.update(sql,travelUser.getTravelUserId());
}
/**
* 根据用户名和密码查询的方法
* @param username
* @param password
* @return
*/
@Override
public TravelUserfindByUsernameAndPassword(String travelUserName, String travelUserPassword) {
TravelUser user = null;
try {
//1.定义sql
String sql = "select * fromtravel_user where travel_user_name = ? and travel_user_password = ?";
//2.执行sql
user = template.queryForObject(sql,new BeanPropertyRowMapper<TravelUser>(TravelUser.class),travelUserName,travelUserPassword);
} catch (Exception e) {
}
return user;
}
}
package com.pz.route.service;
import com.pz.route.domain.TravelUser;
publicinterface TravelUserService {
/**
* 注册用户
* @param user
* @return
*/
boolean regist(TravelUser user);
/**
* 激活用户
* @param code
* @return
*/
boolean active(String code);
/**
* 用户登陆
* @param user
* @return
*/
TravelUser login(TravelUser user);
}
package com.pz.route.service.impl;
import com.pz.route.dao.TravelUserDao;
import com.pz.route.dao.impl.TravelUserDaoImpl;
import com.pz.route.domain.TravelUser;
import com.pz.route.service.TravelUserService;
import com.pz.route.util.MailUtils;
import com.pz.route.util.UuidUtil;
public class TravelUserServiceImpl implements TravelUserService {
private TravelUserDao travelUserDao = newTravelUserDaoImpl();
/**
* 注册用户
* @param user
* @return
*/
@Override
public boolean regist(TravelUsertravelUser) {
//1.根据用户名查询用户对象
TravelUser dbUser =travelUserDao.findByTravelUsername(travelUser.getTravelUserName());
//判断u是否为null
if(dbUser != null){
//用户名存在,注册失败
return false;
}
//2.保存用户信息
//2.1设置激活码,唯一字符串
travelUser.setTravelUserCode(UuidUtil.getUuid());
//2.2设置激活状态
travelUser.setTravelUserStatus(1);
travelUserDao.saveTravelUser(travelUser);
//3.激活邮件发送,邮件正文?
String content="<ahref='http://localhost/travel/user/active?code="+travelUser.getTravelUserCode()+"'>点击激活【胖子旅游网】</a>";
MailUtils.sendMail(travelUser.getTravelUserEmail(),content,"激活邮件");
return true;
}
/**
* 激活用户
*@param code
* @return
*/
@Override
public boolean active(String code) {
//1.根据激活码查询用户对象
TravelUser user =travelUserDao.findByTravelUserCode(code);
if(user != null){
//2.调用dao的修改激活状态的方法
travelUserDao.updateTravelUserStatus(user);
return true;
}else{
return false;
}
}
/**
* 登录方法
* @param user
* @return
*/
@Override
public TravelUser login(TravelUsertravelUser) {
return travelUserDao.findByUsernameAndPassword(travelUser.getTravelUserName(),travelUser.getTravelUserPassword());
}
}