前端JS实现密码校验键盘横竖、26字母、相同字母、相同数字、密码包含用户名、数字 字母不能连续 不能相同三个、不能横向 竖向 连续三个 包含字符、不能有中文符号
功能概述：
这段 JavaScript 代码实现了一个密码校验功能，主要用于检查输入的密码是否符合特定的规则，同时也对用户名进行了一些基本的检查。
主要函数功能：
validateFormat(val, min = 5, max = 16)：
检查输入字符串的长度是否在指定范围内（默认为 5 到 16 位）。
通过正则表达式检查字符串中是否至少包含数字、小写字母、大写字母和特殊字符中的三种类型。
- i
sHasChinaCharFun(str)：
检查输入字符串是否包含特定的中文符号（从 allChinaChar 数组中定义的符号）。
getCharAll()：
生成一个包含所有可能的键盘组合值的数组 charAll。包括横向、纵向（正序和反序）以及字母表的组合，还包括将长字符串分割成三个字符一组的各种组合，并去重。
最后还添加了小键盘的一些特定组合。
overlappingSplitByThree(str, flag = true)：
将输入字符串分割成三个字符一组的数组，如果 flag 为 true，则返回正序和反序的组合。
checkNoChinese(str)：
使用正则表达式检查字符串中是否不包含中文字符。
- checkPasswordFun(password, username)：
- 检查用户名和密码是否为空，如果是则返回相应错误信息。
- 检查用户名长度是否小于 5。
- 检查密码中是否包含中文、中文特殊字符以及是否符合长度和字符类型要求。 检查密码是否包含用户名中的连续三个字符。
- 检查密码是否包含连续三位数字、字母或字符（通过与 charAll
数组进行比较）。如果密码不符合任何一项检查，则返回相应的错误信息，否则返回 { flag: true }。
整体流程：
- 首先对输入的用户名和密码进行基本的非空检查。
- 对于用户名，检查长度是否小于 5。
- 对于密码，进行一系列的检查：
- 检查是否包含中文。
- 检查长度和字符类型是否符合要求。
- 检查是否包含中文特殊字符。 检查是否包含用户名中的连续三个字符。
- 检查是否包含连续三位数字、字母或字符（通过与预先生成的键盘组合值数组进行比较）。 如果密码通过所有检查，则返回
{ flag: true }，否则返回包含错误信息的对象。
全部代码
// 字符相关性（连续3个）：
// 1.键盘横竖，
// 2.26字母，
// 3.数字，
// 4.相同字符，
// 5.当前用户名
// 用户名限制最低长度，最低5个字符
/*
首先
1、不能横向 竖向 连续三个 包含字符
2、数字 字母不能连续 不能相同三个
3、不能包含在用户名中 任意连续三个字符
4、只支持英文符号 过滤中文符号比如 。 、 ， ‘ “ 【 】 · 、等
*/
// 保存所有相关性的三个连续的 纵向的 横向的 相同的 数字 字母 符号
// 单纯使用的时候 手动追加用户名
// 所有的中文符号
const allChinaChar = [
"·",
"【",
"】",
"；",
"：",
"’",
"”",
"“",
"‘",
"，",
"。",
"、",
"？",
"《",
"》",
"！",
"￥",
"…",
"（",
"）",
"—",
];
/**
* 键盘字符表(小写)
* 非shift键盘字符表
*/
const charTable1 = [
["`", "1", "2", "3", "4", "5", "6", "7", "8", "9", "0", "-", "=", ""],
["", "q", "w", "e", "r", "t", "y", "u", "i", "o", "p", "[", "]", "\\"],
["", "a", "s", "d", "f", "g", "h", "j", "k", "l", ";", "'", "", ""],
["", "z", "x", "c", "v", "b", "n", "m", ",", ".", "/", "", "", ""],
];
/**
* shift键盘的字符表
*/
const charTable2 = [
["~", "!", "@", "#", "$", "%", "^", "&", "*", "(", ")", "_", "+", ""],
["", "q", "w", "e", "r", "t", "y", "u", "i", "o", "p", "{", "}", "|"],
["", "a", "s", "d", "f", "g", "h", "j", "k", "l", ":", '"', "", ""],
["", "z", "x", "c", "v", "b", "n", "m", "<", ">", "?", "", "", ""],
];
// 所有符号集合
const SpecialStr = "`\[\]!@#$%^&*()\-=\;_+'/,." + '?":{
}|<>\\'
// 长度需min-max位，数字、小写字母、大写字母、特殊字符，至少包含三种
// return true 为通过校验
function validateFormat(val, min = 5, max = 16) {
console.log("val", val);
if (val.length < min || val.length > max) {
return false; // 长度不符合要求
}
const hasLower = /[a-z]/.test(val);
const hasUpper = /[A-Z]/.test(val);
const hasDigit = /\d/.test(val);
const hasSpecial = /[`\[\]!@#$%^&*()\-=\;_+'/,.?":{}|<>\\]/.test(val); // 根据需要调整这个特殊字符集
// const hasSpecial = /[!@#$%^&*(),.?":{}|<>]/.test(val);
let typeCount = 0;
if (hasLower) typeCount++;
if (hasUpper) typeCount++;
if (hasDigit) typeCount++;
if (hasSpecial) typeCount++;
return typeCount >= 3; // 至少包含三种类型的字符
}
// 是否包含中文符号
const isHasChinaCharFun = (str) => {
return allChinaChar.some((i) => str.includes(i));
};
// 所有键盘组合值
let charAll = [];
function getCharAll() {
charAll = [];
// 横向所有的值(正序和反序)-
charTable1.concat(charTable2).forEach((item, index) => {
charAll.push(item.join(""), Object.assign([], item).reverse().join(""));
});
// console.log(charAll, "charAll");
// console.log(charTable1, "charTable1");
// 0: "`1234567890-="
// 1: "=-0987654321`"
// 2: "qwertyuiop[]\\"
// 3: "\\][poiuytrewq"
// 4: "asdfghjkl;'"
// 5: "';lkjhgfdsa"
// 6: "zxcvbnm,./"
// 7: "/.,mnbvcxz"
// 8: "~!@#$%^&*()_+"
// 9: "+_)(*&^%$#@!~"
// 10: "qwertyuiop{}|"
// 11: "|}{poiuytrewq"
// 12: 'asdfghjkl:"'
// 13: '":lkjhgfdsa'
// 14: "zxcvbnm<>?"
// 15: "?><mnbvcxz"
// 反斜杠纵向所有的值(正序和反序)\
// 这里得到的数据例如是 1qaz 2wsx 3edc
for (let i = 0; i < charTable1[0].length; i++) {
let sb1 = [];
let sb2 = [];
charTable1.forEach((item) => {
sb1.push(item[i]);
});
charTable2.forEach((item) => {
sb2.push(item[i]);
});
// 去除长度小于3的值
if (sb1.join("").length >= 3) {
charAll.push(sb1.join(""), Object.assign([], sb1).reverse().join(""));
charAll.push(sb2.join(""), Object.assign([], sb2).reverse().join(""));
}
}
// console.log(charAll,'charAll6666')
// return false
// 正斜杠纵向所有的值(正序和反序)/
// 这里得到的数据例如是 0okm 9ijn 8uhb 7ygv
for (let i = 0; i < charTable1[0].length; i++) {
let sb1 = [];
let sb2 = [];
// 比如说 当前i === 8
// 那也就是说charTable1[0]选中的是 8
// 那也就是说charTable1[1]应该选中的是 u i-下标（1）等于7 正好是u
// 那也就是说charTable1[2]应该选中的是 h i-下标（2）等于6 正好是h
// 那也就是说charTable1[3]应该选中的是 b i-下标（3）等于5 正好是b
charTable1.forEach((item, index) => {
if (i - index >= 0) sb1.push(item[i - index]);
});
// console.log(sb1, "sb1 ==================");
charTable2.forEach((item, index) => {
if (i - index >= 0) sb2.push(item[i - index]);
});
// console.log(sb2, "sb2sb2sb2sb2sb2");
// 去除长度小于3的值
if (sb1.join("").length >= 3) {
charAll.push(sb1.join(""), Object.assign([], sb1).reverse().join(""));
charAll.push(sb2.join(""), Object.assign([], sb2).reverse().join(""));
}
}
const chart26 = 'abcdefghijklmnopqrstuvwxyz'
const str =chart26+ '1234567890'+SpecialStr
let strList = []
for(let i =0;i<str.length;i++){
strList = [...strList,str[i]+str[i]+str[i]]
}
// console.log(...overlappingSplitByThree(chart26),'999999999999999')
charAll.push("abcdefghijklmnopqrstuvwxyz",...strList,);
// 将得到的所有字符组合 以上都是超过三位的组合
// 目前的要求是超过三位包含三位都算连续 比如 qaz 1qa aq1 zaq 还需要在处理一下...
// 如果不需要 跳过这个循环就行
charAll.forEach((item) => {
if (item.length > 3) {
charAll.push(...overlappingSplitByThree(item));
}
});
// 去重
charAll = [...new Set(charAll)];
// 增加小键盘 123 456 789
// charAll.push("159", "951", "753", "357");
charAll.push("147", "741", "258", "852", "369", "963");
return charAll;
}
// 将字符串三个三个一组
// 例如 "asdfghbvcx" 输出: "asd,sdf,dfg,fgh,ghb,hbv,bvc,vcx"
/**
*
* @param {*} str 要分割的字符
* @param {*} flag 默认true 加上反转
* @returns
*/
function overlappingSplitByThree(str, flag = true) {
const result = [];
for (let i = 0; i <= str.length - 3; i++) {
result.push(str.slice(i, i + 3));
}
// 如果需要返回逗号分隔的字符串，可以使用 join 方法
// return result.join(',');
// 但这里按照要求返回数组
return flag ? [...result,...overlappingSplitByThree(str.split('').reverse().join(''),false)] : [...result];
}
/**
*
* @param {*} str
* @returns 含有中文返回 false
*/
function checkNoChinese(str) {
const regex = /^[^\u4e00-\u9fa5]+$/;
return regex.test(str);
}
/**
*
* @param {*} password 密码
* @param {*} username 用户名
* @returns Object
*/
export const checkPasswordFun = (password, username,min=5,max=16) => {
// 判断账号
if (!username || username.trim() === "") {
return {
flag: false,
message: "请输入用户名",
};
}
// 判断账号最小长度
if (username.length <5) {
return {
flag: false,
message: "用户名最小长度为5",
};
}
// 判断密码是否存在
if (!password || password.trim() === "") {
return {
flag: false,
message: "请输入密码",
};
}
if (!checkNoChinese(password)) {
return {
flag: false,
message: "密码中不能包含中文",
};
}
// 判断密码位数是否符合要求
if (!validateFormat(password,min=5,max=16)) {
return {
flag: false,
message:
`密码长度为${
min}-${
max}位，数字、小写字母、大写字母、特殊字符，至少包含三种`,
};
}
password = password.toLowerCase();
username = username.toLowerCase();
// 判断密码是否包含中文特殊字符
if (isHasChinaCharFun(password)) {
return {
flag: false,
message: "密码不能包含中文特殊字符",
};
}
// 判断密码中是否包含用户名连续三位
const passwordList = [...overlappingSplitByThree(password, false)];
const usernameList = [...overlappingSplitByThree(username, false)];
// console.log(passwordList, "passwordList");
// console.log(usernameList, "usernameList");
// console.log( passwordList.length + usernameList.length,' passwordList.length + usernameList.length')
// console.log( [...new Set([...passwordList, ...usernameList])].length,' passwordList.length + usernameList.length')
// 两个长度去重之后 长度不相等 说明有重合的 直接毙掉
if([...new Set([...passwordList])].length !== passwordList.length){
return {
flag: false,
message: "密码不能包含包含连续或键盘横竖三位的数字、字母、字符",
};
}
if (
passwordList.length + usernameList.length !==
[...new Set([...passwordList, ...usernameList])].length
) {
return {
flag: false,
message: "密码不能包含账号字符连续三位、",
};
}
// 判断密码中是否包含连续三位数字 字母 字符
const charAll = getCharAll();
// console.log(charAll,'charAll 999999999999')
// console.log(password.includes('abc'),'password 999999999999')
if (charAll.some((i) => password.includes(i))) {
return {
flag: false,
message: "密码不能包含包含连续或键盘横竖三位的数字、字母、字符",
};
}
return {
flag: true,
};
};
使用：
import {
checkPasswordFun} from "@/utils/checkPasswordFun";
window.checkPasswordFun =checkPasswordFun
console.log(checkPasswordFun('1az?ha好的ngjq','zh1aausangwerName'),'898888888888888')
