|为什么网站注册时填写的数据不可重复?

|为什么网站注册时填写的数据不可重复?

文章图片

|为什么网站注册时填写的数据不可重复?

文章图片

|为什么网站注册时填写的数据不可重复?

文章图片

|为什么网站注册时填写的数据不可重复?

今天是刘小爱自学Java的第102天 。
感谢你的观看 , 谢谢你 。
话不多说 , 继续学习注册页面的业务逻辑:


昨天编写了前端校验的代码 , 是为了保证数据的完整性和合法性:

  • 比如用户名密码不能为空 。
  • 比如电话号码不能瞎填 , 格式要正确 。
因为要保证用户在点击注册按钮前实时校验数据 , 所以需要发送异步请求 。
如何实现后台数据校验?
就需要使用到Java经典三层架构来实现了 。
其中今天只是最基本的代码实现 , 后续会进一步将代码优化 。
一、前端页面发送请求在编写Java代码之前 , 前端页面要发送请求 。
因为要保证用户在点击注册按钮前实时校验 , 所以需要使用发送异步请求 , 使用ajax实现异步请求:


①绑定blur事件
给form表单中的email数据栏绑定blur事件 , 该事件的作用在于:
用户在注册页面填写数据时 , 一离开email数据栏就会触发该事件 。
conso.log(\"刘小爱\")这块代码是用来测试事件是否能正常触发的 。
如果浏览器控制台输出“刘小爱” , 则表明该事件能够正常被触发 , 所以出现异常优先排除该事件的问题 。
②发送get请求
get()方法中一共有四个参数:
\"/checkEmailServlet\":url , 也就是请求路径 , 在服务器中要有一个servlet来接受该请求 。
{email:email:发送的请求参数 , 其有两种命名格式 , 这里使用的是第二种: 。
  • key=value&key=value
  • {key:valuekey:value...
function (result){:回调函数 , 当请求成功后会触发该函数 , 其中result是服务器响应的结果 。
\"json\":返回参数的类型 , 可以是xml、html等 , 这里使用的是json 。
二、后台代码编写1web层
创建一个servlet来接受上述提交的请求:


①接受前端请求参数
ajax提交的数据为email , 使用request域对象获取对应的参数即可 。
②交给service层处理
在service层中创建一个UserService接口 , 及其对应的实现类 。
service层返回给web层处理结果 , 其为一个boolean值:
  • 若为true表示邮箱存在 。
  • 若为false表示邮箱不存在 。
③响应数据
将处理后的数据响应给前端 , 因为ajax提交中的数据格式为json , 所以需要将处理结果转换成json格式之后再响应 。
【|为什么网站注册时填写的数据不可重复?】使用JSON.toJSONString() , 可以将对应的数据转换成JSON字符串 。
2service层
service层中 , 一个Service接口对应一个实现类 。 在service包下创建一个impl包专门存放实现类 。


dao层专门去查询数据 , 在service层中只需要调用dao层的方法就好了 。
因为校验email的唯一性只是UserService中的一个业务 , 后续还会有和UserService相关的其它业务 。
所以将dao层的对象设置成一个成员变量 , 这样多个方法都可以引用该dao层对象 。
①dao层查询数据
queryUserByEmail():根据email查询user 。
一般都是这样的一种命名方式 , 一目了然 , 一下子就能知道该方法具体实现了什么功能 。
②判断查询结果
如果查询到一个或者多个user数据 , 则表示该邮箱已经存在了 , 所以返回值为true 。
如果查询到的数据为空 , 则表示该邮箱不存在 , 所以返回值为false 。
3dao层
dao层和service层一样 , 也是一个接口对应一个实现类 。


①初始化JdbcTemplate
使用c3p0连接池获取数据源 , 再创建JdbcTemplate 。
同样的道理 , 多个业务需要使用该模板 , 故将其设置成一个成员变量 。
②查询数据
通过query方法查询 , 该方法在学JdbcTemplate时详细讲过 , 做个简单的回顾 , 其一共有三个参数:
  • sql:即sql语句 。
  • RowMapper:映射器 。
  • email:也就是sql语句中的通配符 。
将查询结果直接返回给service层即可 。
三、页面渲染和测试后台将处理后的数据响应给前端 , 其数据格式为json , 前端要根据结果渲染对应的页面:


①在发送请求前 , 先对邮箱进行前端校验
如果不存在或者格式不对 , 没有必要发送请求给后台 。
使用正则表达式匹配:
  • 满足要求:向服务器发送get请求 。
  • 不满足要求:在页面上报错 , 信息为“输入的邮箱不合法”
②get请求
返回的数据result是一个json数据 , 使用result.checkEmail取出对应的数据:
  • 如果为true:邮箱已存在 , 在页面上报错 , 信息为“邮箱已经被注册”
  • 如果为false:邮箱不存在 , 页面显示“√”
代表编写完毕 , 在前端页面做一个测试:


先在数据库中插入一条数据 , 便于测试 。
①在Email中输入1 , 不符合邮箱的命名规则 , 显示报错信息 “输入的邮箱不合法”
②该邮箱在数据库中不存在 , 所以能正常注册 , 显示一个“√” 。
③该邮箱在数据库中已存在了 , 显示报错信息 \"邮箱已经被注册了\" 。
①和③的区别在于:①是前端校验 , 并没有向后台发送请求 , ③是后台校验 , 发送了请求 , 查询数据库之后得到的结果 。
最后谢谢你的观看 。
如果可以的话 , 麻烦帮忙点个赞 , 谢谢你 。


    推荐阅读