浅谈博客项目是如何实现的（二）

题记：昨天建好了数据，修改了一下域名，写了一个路由，今天我们来设计一下注册页面，以及部分页面的跳转。

如下图1所示，（ps:说了句废话，下图肯定是登录页面嘛），那么我们就从页面跳转开始吧， 点击登录，肯定跳转到登录页面，如下图2所示，因为没有设计账号密码，就算跳转到登录页，也是无济于事~~~那咱们只能往注册页跑~~，刚刚拿到这个页面想当然的认为用href=路径名这样静态页面链接的方式实现页面的跳转。实际上并非如此，应该通过路由找到，该页面所对应的control层，在control层做过一系列的数据判断和处理后，由control层访问对应的view层！（ps:mvc设计理念，如果这个晕了，那就凉了~~~）

图1

图2

图3

确定好命名规范以后，想都不用想，在control层开始定义class，在与之对应的view层定义存放html文件如图4所示

图4

接下来定义路由，（最后定义问题也不是很大）如下图5所示，我已经详细解释了路由的含义

图5

我们到reg.php模块下开始写方法，如图6所示，首先都不要想，返回注册页的方法第一个就要加上去

图6

补充说明见到herf,就要写对应的路由的名字，也就是说，链接不能指向静态页面，必须指向路由地址，由路由地址访问具体方法，再由方法访问页面，如图7所示。

图7

接下写注册方法，也就是对post回来的数据做校验，我们可以在control层链接数据，但是这样写不合理，我们这model层写链接方法，到control层直接new就可以了如图8-图9所示

图8

图9

tp5.1里提供大量的sql操作方法，具体不细说了。这里想强调的是，数据怎么从前端来后端？如图10所示

图10

输入必填信息，点击注册按钮，即可提交成功如图11-图12所示

图11

图12

做完后台数据验证，我们做一些前端表单验证，首先就是对输入的用户名做验证，输入是否为英文数字下划线4-12位数字，bootstrap提供好了样式如图13，也就是说我们只有利益jQuery修改css和html即可，样式已经很完美了

图13

接下来写js做表单验证如图14

图14

重点来了，利用ajax对用户名是否重复做验证，首先写ajax方法，找到username的dom节点如图14is_user_exist方法。ajax通过寻找 dom节点的data-url 找到路由，通过路由访问具体tp方法如下图15所示，当然前提要写好具体路由如图16所示

图15

图16

图17

测试一下如图18所示

图18

注册好以后肯定就要做登录验证，明天接着写

图19