beego用户注册校验
页面说明
1.index
2.list
3.detail
4.cart
5.place_order
6.login
7.register
8.user_center_info
9.user_center_order
10.user_center_site
先来看一下js
在该注册页面中,包含了用户注册时需要填写的信息,
例如:用户名,密码,密码确认,邮箱信息。
在这里,大家需要注意的是,
为了保证用户填写信息的准确性,
在这里需要对用户填写的信息进行校验。
关于表单的校验,
这里需要在<head>标签中引入jquery文件:
<script type="text/javascript" src="/static/js/jquery-1.12.4.min.js"></script>
关于具体校验的实现,已经封装在了一个js文件中了,
该文件为:register.js
所以也需要将该文件在<head>标签中引入一下:
<script type="text/javascript" src="/static/js/register.js"></script>
下面,我们来看一下,register.js文件的具体实现如下:
$(function(){
//定义变量,默认值为false。
var error_name = false;//如果用户名出现了错误,将该变量的值修改为true.
var error_password = false;//如果密码出现了错误,将该变量的值修改为true.
var error_check_password = false;//如果密码确认出现了错误,该变量的值修改为true.
var error_email = false;//如果邮箱出现了错误,该变量的值修改为true.
var error_check = false;//如果选择同意协议,该变量的值修改为true.
//根据id的值,找到“user_name”,并且绑定一个blur事件,也就是当该文本框失去焦点后,执行其对应的方法。
$('#user_name').blur(function() {
check_user_name();
});
//同上
$('#pwd').blur(function() {
check_pwd();
});
//同上
$('#cpwd').blur(function() {
check_cpwd();
});
//同上
$('#email').blur(function() {
check_email();
});
//根据id找到“allow”,并且绑定一个单击事件,并且判断该元素是否被选中,
//如果选中了,将变量 error_check变量的值修改为false,并且将其同胞元素<span>隐藏、
//如果没有选中,将变量error_check变量的值修改为true,并且在其同胞元素<span>上打印“请勾选同意”
//并且将该<span>标签显示出来。
$('#allow').click(function() {
if($(this).is(':checked'))
{
error_check = false;
$(this).siblings('span').hide();
}
else
{
error_check = true;
$(this).siblings('span').html('请勾选同意');
$(this).siblings('span').show();
}
});
//获取用户名的长度,并且进行判断其长度,如果不符合条件,显示出对应的错误提示。
function check_user_name(){
var len = $('#user_name').val().length;
if(len<5||len>20)
{
$('#user_name').next().html('请输入5-20个字符的用户名')
$('#user_name').next().show();
error_name = true;
}
else
{
$('#user_name').next().hide();
error_name = false;
}
}
//获取密码的长度,并且进行长度的判断,如果不符合条件,显示出对应的错误提示
function check_pwd(){
var len = $('#pwd').val().length;
if(len<8||len>20)
{
$('#pwd').next().html('密码最少8位,最长20位')
$('#pwd').next().show();
error_password = true;
}
else
{
$('#pwd').next().hide();
error_password = false;
}
}
//密码确认判断,获取密码框中输入的内容,同时获取“确认密码框”中输入的内容,进行比较。
//如果两个值相等,表示两次输入的密码一致,否则给出错误提示。
function check_cpwd(){
var pass = $('#pwd').val();
var cpass = $('#cpwd').val();
if(pass!=cpass)
{
$('#cpwd').next().html('两次输入的密码不一致')
$('#cpwd').next().show();
error_check_password = true;
}
else
{
$('#cpwd').next().hide();
error_check_password = false;
}
}
//对邮箱格式进行校验,判断其输入的邮箱是否符合对应的格式,如果不符合,给出对应的错误提示。
//这里对邮箱格式的校验,使用了正则表达式。
function check_email(){
var re = /^[a-z0-9][\w\.\-]*@[a-z0-9\-]+(\.[a-z]{2,5}){1,2}$/;
if(re.test($('#email').val()))
{
$('#email').next().hide();
error_email = false;
}
else
{
$('#email').next().html('你输入的邮箱格式不正确')
$('#email').next().show();
error_check_password = true;
}
}
//当用户单击“注册”按钮时,在将数据发送服务端之前,会先调用submit方法,
//在该方法中,会将上面所有校验的方法进行调用,然后判断其对应的变量的值
//如果所有变量的值为false,表示校验全部通过,那么会将表单中的数据发送到服务端,否则是不会发送到服务端的。
//注意:reg_from为form标签的id属性的值,当单击“注册”这个submit按钮时,会先执行submit方法。
//只有该方法最终返回的结果为true,才会将数据发送到服务端。
$('#reg_form').submit(function() {
//调用上面校验的方法。
check_user_name();
check_pwd();
check_cpwd();
check_email();
//判断其变量的值,如果全部为false,表示校验全部通过,这时submit方法最终会返回true,
//这时,才会将表单中的数据发送到服务端。如果submit方法最终返回的是false,就不会向服务端提交发送数据。
if(error_name == false && error_password == false && error_check_password == false && error_email == false && error_check == false)
{
return true;
}
else
{
return false;
}
});
})
接下来设计表
type User struct{
Id int
Username string `orm:"unique;size(100)"`
Password string `orm:"size(100)"`
Email string
Power int `orm:"default(0)"`
Active int `orm:"default(0)"`
Receivers []*Receiver `orm:"reverse(many)"`
}
type Receiver struct{
Id int
Name string
Postcode string
Address string
Phone string
IsDefault bool `orm:"default(false)"`
User *User `orm:rel(fk)`
}
然后来初始化一下models
init(){
orm.RegisterDataBase("default","mysql","root:123@tcp(127.0.0.1:3306)/fresh?charset=utf8")
orm.RegisterModel(new(User),new(Receiver))
orm.RunSyncdb("default",false,true)
}
然后我们写控制器
type UserController struct{
beego.Controller
}
func (this *UserController) ShowRegister(){
this.TplName="register.html"
}
func (this *UserController) HandleRegister(){
username := this.GetString("user_name")
pwd := this.GetString("pwd")
cpwd := this.GetString("cpwd")
email := this.GetString("email")
if user=="" || pwd=="" || cpwd=="" || email==""{
this.Data["err"]="输入数据不完整"
this.TplName="register.html"
return
}
reg,err := regexp.Compile(...)
if err!=nil {
this.Data["err"]="正则创建失败"
this.TplName="register.html"
return
}
res := reg.MatchString(email)
if res==false{
this.Data["err"]="邮箱格式不正确"
this.TplName="register.html"
return
}
if pwd!=cpwd{
this.Data["err"]="两次密码不一致"
this.TplName="register.html"
return
}
//开始处理数据
o := orm.NewOrm()
var user models.User
user.Username =username
user.Password=pwd
user.Email=email
//插入
_,err := o.Insert(&user)
if err!=nil{
this.Data["err"]="用户名重复"
this.TplName="register.html"
return
}
this.Redirect("/login",302)
}
然后增加路由
func init(){
beego.Router("/",&controllers.MainController{})
beego.Router("/register",&controllers.UserController{})
beego.Router("/login",&controllers.UserController{})
}
这边要增加校验的过程
//对接收到的数据进行非空校验
if userName == "" || pwd == "" || cpwd == "" || email == ""{
this.Data["errmsg"] = "输入信息不完整,请重新输入!"
this.TplName = "register.html"
return
}
//判断“密码”和”确认密码“是否一致。
if pwd != cpwd{
this.Data["errmsg"] = "两次输入密码不一致,请重新输入!"
this.TplName = "register.html"
return
}
//对邮箱格式的校验:注意这里使用的是regexp下的Compile方法。
reg,_ := regexp.Compile("^[A-Za-z0-9\u4e00-\u9fa5]+@[a-zA-Z0-9_-]+(\\.[a-zA-Z0-9_-]+)+$")
res := reg.FindString(email)
if res == ""{
this.Data["errmsg"] = "邮箱格式不正确"
this.TplName = "register.html"
return
}
然后我们接收到数据
应该赋值给user对象
o := orm.NewOrm()
user := models.User{}
user.Name = userName
user.PassWord = pwd
user.Email = email
然后我们要校验一下用户名是否重名
err = o.Read(&user,"Name")
if err != orm.ErrNoRows{
this.Data["errmsg"] = "用户已经存在,请重新注册!"
this.TplName = "register.html"
return
}
校验完成之后
如果没有重名的情况
那么就把用户的信息存储到数据库里面
_,err = o.Insert(&user)
if err != nil {
this.Data["errmsg"] = "插入失败,请重新注册!"
this.TplName = "register.html"
return
}