웹 개발 은 Angular 를 사용 하여 사용자 암호 강도 판별 을 실현 하 는 방법

웹 전단 은 Angular 를 사용 하여 사용자 암호 강도 판별 소 기 를 실현 합 니 다.
사용자 암호 합 법 조건:
1,8~16 글자
2.숫자,자모 와""만 포함 할 수 있 습 니 다."(불법 특수 문자 포함 불가)
3.숫자,자모 와""."적어도 두 가 지 를 포함한다.
실현 과정:
길이 측정-주:중국어 와 영어,중국어 두 바이트,영어 한 바 이 트 를 구분 하려 면 비밀 번 호 를 입력 할 때 중국 어 를 입력 할 수 없 지만 사용자 이름 의 사용 을 검사 하려 면 중 영 어 를 구분 해 야 합 니 다.

//        ：        
function GetStrLength(strData)
{
 if(!strData){
  return 0;
 }
 var length = 0;
 for (var i=0; i<strData.length; i++) { 
  var char = strData.charCodeAt(i); 
  //    1 
  if ((char >= 0x0001 && char <= 0x007e) || (0xff60 <= char && char <= 0xff9f)) 
  { 
   length++; 
  } 
  else
  { 
   length+=2; 
  } 
 } 
 return length;
}

알파벳 포함 여부 확인:

function isIncludeLiter(strData)
{ if(!strData){
  return false;
 }
 var reg = /[a-z]/i;
 if (!reg.test(strData))
 {
  return false;
 }
 return true;
}

숫자 포함 여부 확인:

function isIncludeNumber(strData)
{
 if(!strData){
  return false;
 }
 var reg = /[0-9]/;
 if (!reg.test(strData))
 {
  return false;
 }
 return true;
}

특수 문자 포함 여부 확인:모든 특수 문자 포함

function isIncludeSChar(strData)
{
 if(strData == ""){
  return false;
 }
 //       
 var reg = new RegExp("[`~!@#$^&*%()_+=|{}':;',\\-\\[\\].<>/?~！@#￥……&*（）――|{}【】‘；：”“'。，、？]") 
 return reg.test(strData);
}

지정 한 특수 문자 의 개 수 를 통계 합 니 다.여 기 는 특수 문자 만 통계 합 니 다."-"."

function calcCharCount(strData) {
 var matchResult = {
  lineCounts: 0, //'-'  
  dotCounts: 0 // '.'  
 };
 if(!strData){
  return JSON.stringify(matchResult);
 }
 var lineChar = "-", dotChar = "\\."; //       
 var lineRegex = new RegExp(lineChar, 'g'), dotRegex = new RegExp(dotChar, 'g'); //   g           
 var lineResult = strData.match(lineRegex);
 matchResult.lineCounts = !lineResult ? 0 : lineResult.length;
 var dotResult = strData.match(dotRegex);
 matchResult.dotCounts = !dotResult ? 0 : dotResult.length;
 return JSON.stringify(matchResult);
}

암호 강도 판단 조건:
약 한 C 암호 에는 숫자,자모 만 포함 되 어 있 습 니 다.
중 C 암호 에는 숫자,알파벳,모든 특수 문자 가 포함 되 어 있 습 니 다.
강 한 C 구령 에는 숫자,자모 와 여러 개의 특수 문자 가 포함 되 어 있다.
코드 가 많 습 니 다.직접 전체 붙 여 넣 기 복사:

var len = GetStrLen($scope.newPswd); //        
   var matchResult = JSON.parse(calcCharCount($scope.newPswd)); //    '-' '.'        
   //   1   
   $scope.newPswdValidOne = (len >= 8 && len <= 16);
   //   2   
   $scope.newPswdValidTwo = !isIncludeSChar($scope.newPswd);
   //    '-' '.'     
   $scope.newPswdHasSChar = $scope.newPswdValidTwo && (matchResult.lineCounts > 0 || matchResult.dotCounts > 0);
   //     
   $scope.newPswdHasLiter = isIncludeLiter($scope.newPswd);
   //     
   $scope.newPswdHasNumber = isIncludeNum($scope.newPswd);
   //   3   
   $scope.newPswdValidThree = ($scope.newPswdHasNumber && $scope.newPswdHasLiter) || //      
   ($scope.newPswdHasNumber && $scope.newPswdHasSChar) || //        
   ($scope.newPswdHasLiter && $scope.pswdValidChars) || //        
   ($scope.newPswdHasLiter && $scope.newPswdHasNumber && $scope.pswdValidChars); //   、       
   //        
   $scope.newPswdValid = $scope.newPswdValidOne && $scope.newPswdValidTwo && $scope.newPswdValidThree;
   //       
   // 3.       、          ，     
   if ($scope.newPswdValid && $scope.newPswdHasNumber && $scope.newPswdHasLiter && (matchResult.lineCounts > 0 && matchResult.dotCounts > 0)) {
    $scope.newPswdRank = 3;
    $scope.newPswdRankText = " ";
   }
   // 2.       、          ，     ；
   else if ($scope.newPswdValid && $scope.newPswdHasNumber && $scope.newPswdHasLiter && (matchResult.lineCounts > 0 || matchResult.dotCounts > 0)) {
    $scope.newPswdRank = 2;
    $scope.newPswdRankText = " ";
   }
   // 1.        、   ,     ;
   else if ($scope.newPswdValid && $scope.newPswdHasNumber && $scope.newPswdHasLiter) {
    $scope.newPswdRank = 1;
    $scope.newPswdRankText = " ";
   }
   //      
   else {
    $scope.newPswdRank = 0;
    $scope.newPswdRankText = "";
   }

페이지 구현 효 과 는 다음 과 같 습 니 다.





코드 에 있 는$scope 는 AngularJS 의 변수 입 니 다.AngularJS 를 사용 하지 않 으 면 바로 제거 할 수 있 습 니 다.코드 는 여 기 를 클릭 하 십시오.(자원 업로드 후 자원 목록 이 잠시 보이 지 않 기 때문에 잠시 다운로드 할 수 없습니다.자원 업로드 가 성공 하면 주 소 를 업데이트 할 것 입 니 다.그때 다운로드 하 세 요)
총결산
위 와 같이 소 편 이 소개 한 웹 개발 은 Angular 를 사용 하여 사용자 의 비밀번호 강도 판별 을 실현 하 는 방법 입 니 다.여러분 에 게 도움 이 되 기 를 바 랍 니 다.궁금 한 점 이 있 으 시 면 메 시 지 를 남 겨 주세요.소 편 은 제때에 답 해 드 리 겠 습 니 다.여기 서도 저희 사이트 에 대한 여러분 의 지지 에 감 사 드 립 니 다!