Susiha ang Kalig-on sa Password gamit ang JavaScript o jQuery ug Regular nga Ekspresyon (Uban sa Mga Pananglitan sa Server-Side!)
Naghimo ako pagpanukiduki sa pagpangita usa ka maayong panig-ingnan sa usa ka Checker sa Kusog sa Password nga gigamit JavaScript ug Regular nga Pagpahayag (regex). Sa aplikasyon sa akong trabaho, naghimo kami usa ka post balik aron mapamatud-an ang kusog sa password ug kini dili kombenyente alang sa among mga tiggamit.
Unsa man ang Regex?
Ang usa ka regular nga ekspresyon usa ka han-ay sa mga karakter nga nagpasabut sa usa ka sundanan sa pagpangita. Kasagaran, ang ingon nga mga sumbanan gigamit sa mga pagpangita sa mga algorithm alang sa sa pagpangita sa or pagpangita ug pag-ilis operasyon sa mga lubid, o alang sa pagpanghimatuud sa pag-input.
Kini nga artikulo siguradong dili pagtudlo kanimo sa regular nga mga ekspresyon. Nahibal-an ra nga ang abilidad sa paggamit sa Regular Expression hingpit nga gipasimple ang imong pag-uswag samtang gipangita nimo ang mga sundanan sa teksto. Mahinungdanon usab nga hinumdoman nga ang kadaghanan sa mga sinultian sa pag-uswag na-optimize ang regular nga paggamit sa ekspresyon… labi pa sa pag-parse ug pagpangita sa mga sunod-sunod nga lakang, ang Regex kasagaran mas paspas sa server ug sa client-side.
Gipangita nako gamay ang web sa wala pa ako makit-an usa ka panig-ingnan sa pipila ka nindot nga Regular Expressions nga nangita og kombinasyon sa gitas-on, mga karakter, ug mga simbolo. Bisan pa, ang kodigo medyo sobra sa akong lami ug gipahaum alang sa .NET. Mao nga gipasimple nako ang code ug gibutang kini sa JavaScript. Kini naghimo niini nga balido ang password nga kusog sa tinuod nga panahon sa browser sa kliyente sa dili pa kini i-post og balik…
Pag-type Usa ka Password
Sa matag stroke sa keyboard, ang password gisulayan batok sa naandan nga ekspresyon ug pagkahuman gihatag ang feedback sa mogamit sa us aka luwang sa ilalum niini.
JavaScript Password Kusog Function
ang Regular nga Pagpahayag pagbuhat sa usa ka talagsaon nga trabaho sa pagpamenos sa gitas-on sa code. Kini nga JavaScript function nagsusi sa kalig-on sa usa ka password ug kung ang pagpakyas niini sayon, medium, lisud, o hilabihan ka lisud sa pagtag-an. Samtang nag-type ang tawo, nagpakita kini og mga tip sa pagdasig niini nga mahimong mas lig-on. Gipamatud-an niini ang password base sa:
- gitas-on – Kung ang gitas-on ubos o labaw sa 8 ka karakter.
- Sagol nga Kaso – Kung ang password adunay upper ug lower case nga mga karakter.
- Numeros – Kung ang password naglakip sa mga numero.
- Espesyal nga Mga Katangian – Kung ang password naglakip sa espesyal nga mga karakter.
Ang function nagpakita sa kalisud ingon man sa pipila ka mga tip sa pagpagahi sa password sa dugang.
function checkPasswordStrength(password) {
// Initialize variables
var strength = 0;
var tips = "";
// Check password length
if (password.length < 8) {
tips += "Make the password longer. ";
} else {
strength += 1;
}
// Check for mixed case
if (password.match(/[a-z]/) && password.match(/[A-Z]/)) {
strength += 1;
} else {
tips += "Use both lowercase and uppercase letters. ";
}
// Check for numbers
if (password.match(/\d/)) {
strength += 1;
} else {
tips += "Include at least one number. ";
}
// Check for special characters
if (password.match(/[^a-zA-Z\d]/)) {
strength += 1;
} else {
tips += "Include at least one special character. ";
}
// Return results
if (strength < 2) {
return "Easy to guess. " + tips;
} else if (strength === 2) {
return "Medium difficulty. " + tips;
} else if (strength === 3) {
return "Difficult. " + tips;
} else {
return "Extremely difficult. " + tips;
}
}
Kung gusto nimo i-update ang kolor sa tip, mahimo nimo kana pinaagi sa pag-update sa code pagkahuman sa // Return results
linya.
// Get the paragraph element
var strengthElement = document.getElementById("passwordStrength");
// Return results
if (strength < 2) {
strengthElement.textContent = "Easy to guess. " + tips;
strengthElement.style.color = "red";
} else if (strength === 2) {
strengthElement.textContent = "Medium difficulty. " + tips;
strengthElement.style.color = "orange";
} else if (strength === 3) {
strengthElement.textContent = "Difficult. " + tips;
strengthElement.style.color = "black";
} else {
strengthElement.textContent = "Extremely difficult. " + tips;
strengthElement.style.color = "green";
}
jQuery Password Kusog Function
Uban sa jQuery, dili kinahanglan nga isulat namon ang porma nga adunay update sa oninput:
<form>
<label for="password">Enter password:</label>
<input type="password" id="password">
<p id="password-strength"></p>
</form>
Mahimo usab namon usbon ang kolor sa mga mensahe kung gusto namon.
$(document).ready(function() {
$('#password').on('input', function() {
var password = $(this).val();
var strength = 0;
var tips = "";
// Check password length
if (password.length < 8) {
tips += "Make the password longer. ";
} else {
strength += 1;
}
// Check for mixed case
if (password.match(/[a-z]/) && password.match(/[A-Z]/)) {
strength += 1;
} else {
tips += "Use both lowercase and uppercase letters. ";
}
// Check for numbers
if (password.match(/\d/)) {
strength += 1;
} else {
tips += "Include at least one number. ";
}
// Check for special characters
if (password.match(/[^a-zA-Z\d]/)) {
strength += 1;
} else {
tips += "Include at least one special character. ";
}
// Update the text and color based on the password strength
var passwordStrengthElement = $('#password-strength');
if (strength < 2) {
passwordStrengthElement.text("Easy to guess. " + tips);
passwordStrengthElement.css('color', 'red');
} else if (strength === 2) {
passwordStrengthElement.text("Medium difficulty. " + tips);
passwordStrengthElement.css('color', 'orange');
} else if (strength === 3) {
passwordStrengthElement.text("Difficult. " + tips);
passwordStrengthElement.css('color', 'black');
} else {
passwordStrengthElement.text("Extremely difficult. " + tips);
passwordStrengthElement.css('color', 'green');
}
});
});
Paggahi sa Imong Paghangyo sa Password
Importante nga dili lang nimo i-validate ang pagtukod sa password sulod sa imong JavaScript. Makahimo kini sa bisan kinsa nga adunay mga himan sa pagpauswag sa browser nga makalikay sa script ug magamit ang bisan unsang password nga gusto nila. Kamo kinahanglan kanunay nga mogamit sa usa ka server-side check aron ma-validate ang kusog sa password sa dili pa kini itago sa imong platform.
PHP Function Alang sa Kalig-on sa Password
function checkPasswordStrength($password) {
// Initialize variables
$strength = 0;
// Check password length
if (strlen($password) < 8) {
return "Easy to guess";
} else {
$strength += 1;
}
// Check for mixed case
if (preg_match("/[a-z]/", $password) && preg_match("/[A-Z]/", $password)) {
$strength += 1;
}
// Check for numbers
if (preg_match("/\d/", $password)) {
$strength += 1;
}
// Check for special characters
if (preg_match("/[^a-zA-Z\d]/", $password)) {
$strength += 1;
}
// Return strength level
if ($strength < 2) {
return "Easy to guess";
} else if ($strength === 2) {
return "Medium difficulty";
} else if ($strength === 3) {
return "Difficult";
} else {
return "Extremely difficult";
}
}
Function sa Python Alang sa Kalig-on sa Password
def check_password_strength(password):
# Initialize variables
strength = 0
# Check password length
if len(password) < 8:
return "Easy to guess"
else:
strength += 1
# Check for mixed case
if any(char.islower() for char in password) and any(char.isupper() for char in password):
strength += 1
# Check for numbers
if any(char.isdigit() for char in password):
strength += 1
# Check for special characters
if any(not char.isalnum() for char in password):
strength += 1
# Return strength level
if strength < 2:
return "Easy to guess"
elif strength == 2:
return "Medium difficulty"
elif strength == 3:
return "Difficult"
else:
return "Extremely difficult"
C# Function Alang sa Kalig-on sa Password
public string CheckPasswordStrength(string password) {
// Initialize variables
int strength = 0;
// Check password length
if (password.Length < 8) {
return "Easy to guess";
} else {
strength += 1;
}
// Check for mixed case
if (password.Any(char.IsLower) && password.Any(char.IsUpper)) {
strength += 1;
}
// Check for numbers
if (password.Any(char.IsDigit)) {
strength += 1;
}
// Check for special characters
if (password.Any(ch => !char.IsLetterOrDigit(ch))) {
strength += 1;
}
// Return strength level
if (strength < 2) {
return "Easy to guess";
} else if (strength == 2) {
return "Medium difficulty";
} else if (strength == 3) {
return "Difficult";
} else {
return "Extremely difficult";
}
}
Function sa Java Alang sa Kalig-on sa Password
public String checkPasswordStrength(String password) {
// Initialize variables
int strength = 0;
// Check password length
if (password.length() < 8) {
return "Easy to guess";
} else {
strength += 1;
}
// Check for mixed case
if (password.matches(".*[a-z].*") && password.matches(".*[A-Z].*")) {
strength += 1;
}
// Check for numbers
if (password.matches(".*\\d.*")) {
strength += 1;
}
// Check for special characters
if (password.matches(".*[^a-zA-Z\\d].*")) {
strength += 1;
}
// Return strength level
if (strength < 2) {
return "Easy to guess";
} else if (strength == 2) {
return "Medium difficulty";
} else if (strength == 3) {
return "Difficult";
} else {
return "Extremely difficult";
}
}
Ug kung nangita ka lang usa ka maayo nga generator sa password, nagtukod ako usa ka nindot nga gamay nga himan sa online alang niana.