laravel8实现注册功能

最新推荐文章于 2023-06-19 14:42:07 发布

php的绯闻女友

最新推荐文章于 2023-06-19 14:42:07 发布

阅读量1.4k

点赞数 2

分类专栏： laravel 文章标签： laravel

本文链接：https://blog.csdn.net/Moxi099/article/details/117230879

版权

laravel 专栏收录该内容

13 篇文章 5 订阅

订阅专栏

1.写出注册页面

在public/resourses/views文件夹下面新建register文件夹，再在register文件夹里面新建index.blade.php文件

在index.blade.php文件中写入：注意：此处是我找的模板，css文件和js文件放在public文件下面。注意路径和引用方法模板文件地址：https://www.mycodes.net/192/10205.htm

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>register</title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="robots" content="all,follow">
    <!-- Bootstrap CSS-->
    <link rel="stylesheet" href="{{ 'Bootstrap/css/bootstrap.min.css' }}">
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Poppins:300,400,700">
    <link rel="stylesheet" href="{{ 'Bootstrap/css/style.default.css' }}" id="theme-stylesheet">
    <link rel="stylesheet" href="{{ 'layui/css/layui.css' }}">
  </head>
  <body>
    <div class="page login-page">
      <div class="container d-flex align-items-center">
        <div class="form-holder has-shadow">
          <div class="row">
            <!-- Logo & Information Panel-->
            <div class="col-lg-6">
              <div class="info d-flex align-items-center">
                <div class="content">
                  <div class="logo">
                    <h1>欢迎注册</h1>
                  </div>
                </div>
              </div>
            </div>
            <!-- Form Panel    -->
            <div class="col-lg-6 bg-white">
              <div class="form d-flex align-items-center">
                <div class="content">
                    <div class="form-group">
                      <input id="register-username" class="input-material" type="email" name="registerUsername" placeholder="请输入邮箱" >
								      <div class="invalid-feedback">
								        	请输入正确的邮箱格式
								      </div>
                    </div>
                    <div class="form-group">
                      <input id="register-password" class="input-material" type="password" name="registerPassword" placeholder="请输入密码"   >
                    	<div class="invalid-feedback">
								        	密码必须在6~10位之间
								      </div>
                    </div>
                    <div class="form-group">
                      <input id="register-passwords" class="input-material" type="password" name="registerPasswords" placeholder="确认密码"   >
                    	<div class="invalid-feedback">
								        	两次密码必须相同 且在6~10位之间
								      </div>
                    </div>
                    <div class="form-group">
                      <button id="regbtn" type="button" name="registerSubmit" class="btn btn-primary">注册</button>
                    </div>
                  <small>已有账号?</small><a href="login.html" class="signup">&nbsp;登录</a>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <!-- JavaScript files-->
    <script src="{{ 'Bootstrap/js/jquery.min.js' }}"></script>
    <script src="{{ 'Bootstrap/js/bootstrap.min.js' }}"></script>
    <script src="{{ 'layui/layui.js' }}"></script>
    <script>
    	$(function(){
    		/*错误class  form-control is-invalid
    		正确class  form-control is-valid*/
    		var flagName=false;
    		var flagPas=false;
    		var flagPass=false;
    		/*验证邮箱*/
    		var name,passWord,passWords;
    		$("#register-username").change(function(){
    			name=$("#register-username").val();
			    var re=/^([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+\.[a-zA-Z]{2,3}$/
    			if(!re.test(name)){
    				$("#register-username").removeClass("form-control is-valid")
    				$("#register-username").addClass("form-control is-invalid");
    				flagName=false;
    			}else{
    				$("#register-username").removeClass("form-control is-invalid")
    				$("#register-username").addClass("form-control is-valid");
    				flagName=true;
    			}
    		})
    		/*验证密码*/
    		$("#register-password").change(function(){
    			passWord=$("#register-password").val();
    			if(passWord.length<6||passWord.length>18){
    				$("#register-password").removeClass("form-control is-valid")
    				$("#register-password").addClass("form-control is-invalid");
    				flagPas=false;
    			}else{
    				$("#register-password").removeClass("form-control is-invalid")
    				$("#register-password").addClass("form-control is-valid");
    				flagPas=true;
    			}
    		})
    		/*验证确认密码*/
    		$("#register-passwords").change(function(){
    			passWords=$("#register-passwords").val();
    			if((passWord!=passWords)||(passWords.length<6||passWords.length>18)){
    				$("#register-passwords").removeClass("form-control is-valid")
    				$("#register-passwords").addClass("form-control is-invalid");
    				flagPass=false;
    			}else{
    				$("#register-passwords").removeClass("form-control is-invalid")
    				$("#register-passwords").addClass("form-control is-valid");
    				flagPass=true;
    			}
    		})
    		
    		$("#regbtn").click(function(){
    			if(flagName&&flagPas&&flagPass){
    				localStorage.setItem("name",name);
    				localStorage.setItem("passWord",passWord);
    				// location="login.html"
            $.post('doRegister',{'name':name,'psw':passWord,'_token':"{{ csrf_token() }}"},function(res){
              //为避免layui与bootstrap冲突
              layui.use('layer', function(){
                var layer = layui.layer;
                if(res.code>0){
                  layer.msg(res.msg,{icon:1,time:1500},function(){
                    location="login";//跳转到login页面
                  })
                  }else{
                  layer.msg(res.msg,{icon:2,time:1500});
                  }
              });
              
            })
    			}else{
    				if(!flagName){
    					$("#register-username").addClass("form-control is-invalid");
    				}
    				if(!flagPas){
    					$("#register-password").addClass("form-control is-invalid");
    				}
    				if(!flagPass){
    					$("#register-passwords").addClass("form-control is-invalid");
    				}
    			}
    		})
    	})
    </script>
  </body>
</html>

2.新建register控制器（使用cmd进入laravel根目录--这个根目录就是安装laravel时自定义的文件名称，如果按照文档安装的laravel,那么可能是blog）

php artisan make:controller Register

在控制器的class中写入：

public function index(){
        return view('register.index');
}

3.在routes/web.php中写入：

use App\Http\Controllers\Register;
Route::get('/register',[Register::class,'index']);

此时在浏览器输入自定义域名/register可以访问register页面了。

4.点击提交后需要做的操作

4.1 在routes/web.php中写入

Route::post('/doRegister',[Register::class,'doRegister']);

4.2在register中写入：

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use Illuminate\Support\Facades\Validator;
use App\Models\User;
class Register extends Controller
{
    //
    public function index(){
        return view('register.index');
    }
    public function doRegister(Request $request){
        //1.获取用户的数据    2.验证用户名是否已经存在  3.在model中做相应数据处理   4.返回信息

        $name=$request->post('name');
        $pwd=$request->post('psw');
        
        $messages = [
            'name.unique' => '该邮箱已注册!',
        ];
        $validator=Validator::make(request()->all(),
            ['name'=>'unique:user,email'],$messages
        );
        if($validator->fails()){
            return ['code'=>0,'msg'=>$validator->errors()->first()];
        }
        $m=new User();
        $model=$m->setUser($name,$pwd);//添加用户
        return $model;
    }
}

4.3在models/user下面写入：记得去database文件配置数据库名字等信息。

use Illuminate\Support\Facades\Crypt;
protected $table='user';
//添加用户
    public function setUser($name,$pwd){
        //将数据存储进数据库表，并将密码加密
        $pwd=Crypt::encryptString($pwd);
        $result=$this->insert(['email'=>$name,'password'=>$pwd]);
        if($result>0){
            return ['code'=>1,'msg'=>'注册成功!'];
        }else{
            return ['code'=>0,'msg'=>'注册失败！'];
        }
    }

至此，注册功能告一段落。