How to create a remember me function in login without using form in javascript or jquery

Question

I\'m almost done with my project, but the specifications for my login is not yet 100% done. Remember me function is not yet working.

HTML

Answer 1

Auto Login system.

'Remember me' is not actually used to display user name and password on the login form because this feature is already provided by any browser. But it is intended for automatic login when users revisit the web.

To make auto login system without storing login credential on cookie is by adding database table that store userid and login_string.

Insert/Update the login_string every user login.

And when user login using remember me (press the radio button), then store the login_string on the cookie.

-------------------------------------------------------------------
id (ai)  | userid   | login_string (128 chars) 
--------------------------------------------------------------------
1        |  1       | 86faabe4142269e2274df911a....
--------------------------------------------------------------------
2        |  2       | 013835e194d75c183dc914c9e....

Login_string must be a unique string and can be created by this way :

$login_string = hash('sha512', $userid . $_SERVER['HTTP_USER_AGENT'] . time());

The result is a unique 128 string length.

To store login_string on the cookie :

if(isset(post('remember_me')) {

     $cookie_name  = 'user_str_session';  
     $cookie_value = $login_string;
     setcookie($cookie_name, $cookie_value, time() + (86400 * 1), "/"); // one day example

}

Next time the user close the browser and revisit the web ( where normally login session has expired ), then at the first page load, system will find the login_string and return the userid. By using this userid, system will create login session for automatic login.

Example script :

if(!isset($_SESSION['id'])) {

        if(isset($_COOKIE['user_str_session'])) {
            $user_string = $_COOKIE['user_str_session'] ;

            $sql   = "SELECT `userid` FROM `users_log` WHERE `string` =? ";
            $query = $this->db->query($sql, $user_string);

            $userid = $query->row()->userid;

            if($userid) {                                                 
               $_SESSION['id'] = $userid;                     
            }   
           }
     }

To prevent the login_string on a public computer, apply user logout by deleting the login_string on cookie.

function logout()
   {            
      // remove cookie
      setcookie("user_str_session", "", time() - 3600);

      session_destroy(); 
      redirect('/');    
   }

This is only a brief description to create an automatic login system. Practically you can play with your own style and needs.

Answer 2

When login form has been sumbitted check the checkbox, if it has been checked, store the login form data including username and password in a related cookie. the next time a user comes to the page you can read the cookie, if it is set fill the form with the stored data.

this fiddle can help you: https://jsfiddle.net/wrvnsst2/

you can use the below link to learn how to work with cookies in jquery: http://www.sitepoint.com/eat-those-cookies-with-jquery/

some codes to explain more:

$(document).on(ready,function(){

fillByMemory()
$('button#sign').on('click',function(){

    if($('#rememberChkBox').val()){
        rememberMe();
    }


doLogin();
});



});

function rememberMe(){
         $.cookie('id',$('#signinId').val());
         $.cookie('pass',$('#signinPwd').val());

}

function fillByMemory(){
    if(!!$.cookie('id'))
        $('#signinId').val($.cookie('id'));

    if(!!$.cookie('pass'))
        $('#signinPwd').val($.cookie('pass'));
}

Answer 3

Its working perfectly for me..

You need Jquery.cookie.min.js..

    $(function () {

    if (localStorage.chkbox && localStorage.chkbox != '') {
        $('#rememberChkBox').attr('checked', 'checked');
        $('#signinId').val(localStorage.username);
        $('#signinPwd').val(localStorage.pass);
    } else {
        $('#rememberChkBox').removeAttr('checked');
        $('#signinId').val('');
        $('#signinPwd').val('');
    }

    $('#rememberChkBox').click(function () {

        if ($('#rememberChkBox').is(':checked')) {
            // save username and password
            localStorage.username = $('#signinId').val();
            localStorage.pass = $('#signinPwd').val();
            localStorage.chkbox = $('#rememberChkBox').val();
        } else {
            localStorage.username = '';
            localStorage.pass = '';
            localStorage.chkbox = '';
        }
    });
});