User Registration ideas

The most important is registered calibration data, it is divided into front-end and back-end verification check

For non-average user, can be modified by modifying the code to check the front step, it does not send data to the background and rules, if the backend did not check, it will be affected, such as registration information, voted for information

 

Thinking:

1. Register to do what?

　　Sending of username and password for some information, but we must first verify that the user name, user name, then do not exist to registration, the registration does not exist

2. Where to start checking the user name

　　In the input box loses focus is asynchronous check　　

<div class = " the Login-body " > 
        <div class = " the Login-Card " > 
            <div class = " the Login-Top " > 
                <h3> New user </ h3> 
                <H5> Dear users, welcome back ! </ H5> 
            </ div> 
            <div class = " Login-bottom " > 
                <form Method = " POST " Action = " / User / Register / "">
                    <div class="login-input-box">
                        {% csrf_token %}
                        <input type="text" id="uname" name="uname" value="" onfocus="resetUname()" onblur="checkUname(this.value)" class="login-admin"User Registration"=
                               placeholder">
                        <span style="color:red;" id="aSpan"></span>

                        <input type="password" id="pwd" name="pwd" value="" onfocus="resetUname()" class="login-password">
                        <span style="color:red;" id="pSpan"></span>

                        <button class="login-btn" style="color: white;text-decoration: none;cursor: pointer">注册</button>
                    </div>
                </form>
                <div class="login-img">
                    <img src="/static/login_05.png" alt="">
                </div>
            </div>
        </div>
    </div>

html

<script>
        function isEmail(str) {
            var reg = /^[a-zA-Z0-9_-]{6,}@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/;
            return reg.test(str);
        }

        function resetUname() {
            $('#aSpan').text('');
            $('#pSpan').text('');
        }

        function checkUname(username) {
            var flag = false;
            $.ajax({
                url: '/user/checkUname/',
                type: 'GET',
                async: false,
                data: {'uname': username},
                success: function (result) {
                    var cflag = result.flag;
                    if (cflag) {
                        $('#aSpan').html('用户名已存在！');
                    }else {
                        flag = true;
                    }
                }
            }); 
            Return In Flag; 
        } 

        function Register () { 
            // Get the value of the input box 
            var Account = $ ( ' #uname ' ) .val ();
             var password = $ ( ' #pwd ' ) .val (); 

            / / simple parity 
            IF (account.length < . 6 !! || isEmail (Account) || checkUname (Account)) { 
                $ ( ' #aSpan ' ) .text ( ' mailbox format is not correct! ' );
                 return  to false ; 
            } 

            if(password.length < . 6 ) { 
                $ ( ' #pSpan ' ) .text ( ' password length not less than six ' );
                 return  to false ; 
            } 

            hex_pwd = hex_md5 (password); 
            $ ( ' #pwd ' ) .val (hex_pwd );
             return  to true ; 
        }
     </ Script>

js

class CheckUnameView (View): 
    DEF GET (Self, Request): 
        # acquisition request parameter 
        the uname = `` request.GET``. GET ( ' the uname ' , '' ) 

        # The name of the user to query the database 
        userList = UserInfo.objects.filter (the uname = the uname) 

        In Flag = False 

        # determines whether there 
        iF userList: 
            In Flag = True 

        return jsonResponse ({ ' In Flag ' :} In Flag)

Backend validate the user name