1

I am working on a login system where you hash the password on the client side, before sending it to the server. I have got as far as grabbing the password and hashing it, and now I just need to insert it into the database and/or compare for a login.

    <form action="javascript:;" onsubmit="return changeFormLogin()">
        <p>Email</p>
        <input id="username" type="email" name="username" placeholder="Enter Email" required>
        <p>Password</p>
        <input id="getPass" type="password" name="password" placeholder="••••••" required>
        <input type="submit" name="login" value="Sign In">
        <p id="demo"></p>
    </form>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/js-sha256/0.9.0/sha256.min.js" ></script>
    <script>
        function changeFormLogin() {
            var pass = document.getElementById('getPass').value;
            var username  = document.getElementById('username').value;
            var getSalt = 123566;
            var hashpass = sha256(pass+pass);
            console.log(hashpass);
            var tmp = validateLogin(hashpass);
            if(tmp ==1){                        
                //Welcome the user back, and load new form
            }
            else{
                //Tell them to try again, notify them.
            }

            document.getElementById("demo").innerHTML = hashpass; //Used for testing
            return true;

        }
Trenton McKinney
  • 56,955
  • 33
  • 144
  • 158
h.man96
  • 21
  • 1

3 Answers3

1

For simplicity I always use a FormData object when sending data

var fd = new FormData(); fd.append("Name", [VALUE]);

Then send that object in an XmlHttpRequest

Also, I don't really do security so I wouldn't know, but should the hashing be done server side?

crgowen
  • 11
  • 5
0

Why not shift the entire encryption logic to the server side and insert into the database ? This way you just change action to your server page and POST it.

But if if you want to keep it this way, then you can do a ajax call in your JavaScript function.

Refer : https://www.w3schools.com/js/js_ajax_http_send.asp

Note: Although no one can reverse hash this thing, but still passwords will be visible from developer tools and brute force algorithm can be applied to get the password, so doing this thing in server is recommended

Edit :

Form submit with AJAX passing form data to PHP without page refresh

vS12
  • 310
  • 2
  • 8
0

You could:

  1. Send the information in a form using a POST or GET request (will result in a page refresh).
  2. Use AJAX/XMLHttpRequest (without a page refresh).
  3. Use a cookie.

Since you are trying to make a login system then I would recommend using a POST request (so it doesn't show the submitted info in the url bar) and a PHP session to check if the user has logged in yet (here's an example).

Not only that but if you want to keep your users login information private you shouldn't be using javascript for the authentication, search for tutorials on how to hash a password the right way, you'll find lots of related material on stackoverflow and information security.

PHP by default only supports bcrypt and argon but they are still better than SHA256 as SHA/HMAC is faster to computer and therefore faster to crack.

mrbear258
  • 46
  • 4