齐博x1第五季《项目实战-留言板》16-表单验证

2022-05-13 作者:torylf 分类:教程 阅读:662

即时演示地址:http://x1.alaiyeshi.net/msgboard



表单验证大家都知道,比如我们留言板,现在直接点击提交按钮就是可以提交信息的,这样非常不好,



所以我们第一件事就是让表单,不能空提交。我们可以利用html5的特性,直接在表单元素里添加required属性,

就可以简单的防止表单不能为空提交了


表单验证是分前台验证和后台验证的,后台验证是必须符合验证规则才可以提交,前台验证是增加用户体验,

完善系统健壮性,因为前台验证是可以通过F12控制台等跳过的,后台验证则是通过提交数据发送请求来验证,

如果不符合规则是提交不了的。


也就是说,上面我们的空字段只是用户体验,通过浏览器调试,删除对应属性,还是可以提交的。

可以直接删除属性,再提交,使其无效。


所以我们要真正让其不为空,必须后台对其验证,比如我们在add方法里加上三个判断

再次提交,如果没有前台的required,就会返回


因为后续还需要做别的验证,我们直接定义一个方法,把验证代码放到该方法里,需要时候调用即可


邮箱和电话这里我们还可以做格式的约束,这样就不会让用户乱填也可以提交:


我们这里用正则表达式来验证邮箱和手机的格式,注意,手机完整格式相当复杂,所以我们这里只是简单使用数字和位数来验证

号码段不做验证,如果填写的不是数字和不是11位,才提示错误。






关于内容,我们可以做一个字数验证,之前我们数据表用的是varchar(255)类型,也就是说,我们只能写入255个字符,

如果超出255字符,数据库是无法保存的。所以我们这里限定到200个字符。毕竟留言板不需要长篇大论的。


注意,这里有一个数据库版本问题,在mysql5.x之前,一个汉字在utf8下是存3个字节,也就是说255只能存85个汉字,

不过5.x后,varchar(255) 可以存255个汉字了。有兴趣的可以自行搜索相关资料,这里不做深入


统计字符我们可以用php的mb_strlen函数来统计,这样我们只要判断接收过来的content字段字符串的个数,如果大于200就返回错误。


一般控制字段字数,可以在后台参数那里加一个参数选项来设置,但是留言板本来字数就少,我们这里就固定写死到200个字符就可以了。


表单验证到这里就结束了,一般来说前台也需要写一个JavaScript的验证,为什么呢,因为前台验证可以做一些好看的特效增加用户体验外,

还可以减少对服务器的请求,给服务器减少压力。可以想一下,我们第一次提交数据错误,服务器验证一次,第二次再提交数据错误,服务器又要验证一次,

如此反复,每次提交都要请求一次,如果加上前台js验证,第一次提交数据错误,前台就帮我们验证好了,然后向服务器发送请求,服务器只验证一次就好,

因为数据反复错误,前台都会帮我们验证好,不会占用服务器资源。虽然用户可以通过禁用js来跳过验证,但是正常用户都不会去这么干的,

所以一个健壮性、稳定性的系统一般都会有前后台双重验证。


当然我们这里只是简单的演示表单,就不错前台验证了,后台的已经够用。


复杂的表单,tp系统也提供了一套验证机制,可以自定义规则,然后实例化相关的验证类即可,有兴趣的用户不妨查看下文档试一下。



到此我们为其命名为留言板1.11版本,即msgboard 1.11








来源: 神盾工作室    转载请注明出处!

本文地址:https://www.shieldsoho.com/article/156.html

 标签: 模块开发 齐博X1
{{item.nickname}} @回复
发表于{{item.create_time}}

  • {{replyitem.nickname}} {{item.create_time}}
    @{{item.nickname}}

查看更多评论