JavaScript Client side Password hashing and encryption

JavaScript Client side Password hashing and encryption

In this Post We Will Explain About is JavaScript Client side Password hashing and encryption With Example and Demo.

Welcome on Pakainfo.com – Examples ,The best For Learn web development Tutorials,Demo with Example! Hi Dear Friends here u can know to javascript – Password encryption at client side

In this post we will show you Best way to implement How to encrypt password in HTML page using javascript, hear for How to How to get_encrypt_pass password on client side using Javascript with Download .we will give you demo,Source Code and examples for implement Step By Step Good Luck!.

Read Also:  Angular 6 Hello World Application from Scratch

Add External Scripts

<script src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/3.1.2/rollups/aes.js"></script>
<script src="http://crypto-js.googlecode.com/svn/tags/3.1.2/build/rollups/md5.js"></script>

index.html

<form class="form-form_login" method="post" name="form_login" id="form_login">       
<input type="password"  name="password" id="password" placeholder="Password" id="password" value=""  /> 
<input type="hidden" name="value_hide" id="value_hide" />
<div style="color:red" id="onerror"></div>
<input type="submit" name="login"  type="submit" onclick="return get_encrypt_pass()" value="Submit"  >
</form>

Javascrit for get_encrypt_passion

<script>
function get_encrypt_pass()
{
	var live_password=document.getElementById('password').value;
	var value_hide=document.getElementById('value_hide').value;
		if(live_password=="")
		{
			document.getElementById('onerror').innerHTML='Error:Password is missing';
			return false;
		}
		else 
		{
			document.getElementById("value_hide").value = document.getElementById("password").value;
			var real_hasval = CryptoJS.MD5(live_password);
			document.getElementById('password').value=real_hasval;
			return true;
		}
}	
</script>

Full code : how to encrypt password in javascript using md5

In this HTML form we created simple one password input formfield and one simple input hidden field. Hidden field or hidden value is used for hold simple the value of actual or hashing password.

 
<html>
<head>
<title>Easy step to Encrypt Password using javascript on client Side</title>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/3.1.2/rollups/aes.js"></script>
<script src="http://crypto-js.googlecode.com/svn/tags/3.1.2/build/rollups/md5.js"></script>
<script>
     function get_encrypt_pass()
	 {
        var live_password=document.getElementById('password').value;
		var value_hide=document.getElementById('value_hide').value;
		
		if(live_password=="")
		{
		   document.getElementById('onerror').innerHTML='Error:Password is missing';
		   return false;
		}
		else 
		{
		   document.getElementById("value_hide").value = document.getElementById("password").value;
		   var real_hasval = CryptoJS.MD5(live_password);
		   document.getElementById('password').value=real_hasval;
		  return true;
		}
	}	
</script>
</head>
<body>
<form class="form-form_login" method="post" name="form_login" id="form_login">       
<input type="password"  name="password" id="password" placeholder="Password" id="password" value=""  /> 
<input type="hidden" name="value_hide" id="value_hide" />
<div style="color:red" id="onerror"></div>
<input type="submit" name="login"  type="submit" onclick="return get_encrypt_pass()" value="LOGIN"  >
 </form>
</body>
</html>

Example

Read Also:  javascript difference between two dates in years months days

I hope you have Got Encrypting password at client side and decrypting at server side And how it works.I would Like to have FeadBack From My Blog(Pakainfo.com) readers.Your Valuable FeadBack,Any Question,or any Comments abaout This Article(Pakainfo.com) Are Most Always Welcome.