>  기사  >  웹 프론트엔드  >  AngularJs 사용자 로그인 상호 작용 및 확인, FQ 처리 차단 자세한 설명

AngularJs 사용자 로그인 상호 작용 및 확인, FQ 처리 차단 자세한 설명

小云云
小云云원래의
2018-01-20 14:09:571459검색

이 글은 주로 AngularJs 사용자 로그인 문제 처리, FQ 처리 차단 등을 자세히 소개합니다. 관심 있는 친구들이 참고하면 도움이 될 것입니다.

1 로그인에 성공하면 사용자의 데이터를 쿠키나 세션에 저장하고 $state 서비스를 사용하여 지정된 페이지로 이동합니다.


<p class="register-frame-all">
  <p class="register-frame">
   <p class="register-msg">
    <i></i>
    <form name="loginForm" ng-submit="loginAction()">
     <p class="form-group">
      <p class="input-group">
       <span class="input-group-addon register-user"></span>
       <input autocomplete="off" type="number" class="form-control" placeholder="请输入手机号" required ng-model="loginData.loginName" name="loginName">
      </p>
      <p class="input-group">
       <span class="input-group-addon register-pwd"></span>
       <input type="password" class="form-control" placeholder="请输入密码" required ng-model="loginData.pwd" name="pwd">
      </p>
      <button type="submit" class="btn btn-block btn-danger"
        ng-disabled="!( (loginForm.loginName.$valid) && (loginForm.pwd.$valid) )">登录</button>
      <em></em>
     </p>
    </form>
   </p>
   <p class="register-pic" ng-style="registerRnum"></p>
  </p>
 </p>

4 다음 단계는 사용자가 다른 방법으로 로그인 페이지를 건너뛰는 것을 방지하는 것입니다. (주소 표시줄에 페이지에 들어갈 주소를 직접 출력하는 등) Anti-FQ 동작:

앞서 언급한 것처럼 매번 a를 입력하기 전에 컨트롤러가 처음 실행한 run 메서드에 이 메서드의 동작을 넣습니다. 페이지에서 사용자가 합법적인 로그인인지 확인하고, 합법적인 로그인이 아니면 로그인 페이지로 이동하게 합니다.


$http({
    url:G.apiUrl_dl+&#39;loginByPhone&#39;,
    method:&#39;post&#39;,
    data:{
     &#39;phone&#39;:loginName,
     &#39;pwd&#39;:pwd
    },
    headers:{&#39;Content-Type&#39;:&#39;application/x-www-form-urlencoded&#39;},
    transformRequest: function(obj) {
     var str = [];
     for(var p in obj){
      str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));
     }
     return str.join("&");
    }
   }).success(function(data){
    // 登录成功后的操作...18     19    });

관련 권장 사항:


AngularJS 환경 구축 초보자 튜토리얼

자세한 설명 AngularJS의 사용자 정의 명령어 구현


AngularJS에서 사용자 정의 명령어와 명령어 구성 항목을 구현하는 방법에 대한 자세한 설명

위 내용은 AngularJs 사용자 로그인 상호 작용 및 확인, FQ 처리 차단 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.