AngularJS + PassPort自動填充並記住密碼

Question

我有我的web應用程序與2輸入（電子郵件/密碼）的登錄頁面。事實上，所有的一切都適用於NodeJS/PassPort/Angular。不過，我在Chrome和Firefox上遇到了自動填充和記住密碼的問題。

1）在Chrome上，瀏覽器不問我是否要保存密碼，沒有自動填充，它不記得我的表單上的任何內容。這很煩人。

2）在Firefox上，瀏覽器要求我保存密碼並保存。然而，當我回來時，我的輸入被填充，但如果我點擊「登錄」，什麼也沒有發生，我必須在登錄前編輯每個字段的值。

我已經閱讀了很多關於AJAX和自動填充的內容，但是我對這類內容完全陌生，而且我不瞭解所有內容。

這裏是我的前端代碼：

的login.html

<form class="form-signin" 
         name="form" 
         ng-submit="login(form)" 
         novalidate> 

        <div ng-class="{'has-error': form.email.$error.mongoose}"> 
         <input type="text" 
           class="form-control" 
           placeholder="Email" 
           name="email" 
           ng-model="user.email" 
           required 
           autofocus 
           mongoose-error> 
         <p class="help-block" 
          ng-show="form.email.$error.mongoose"> 
          {{ errors.email }} 
         </p> 
        </div> 

        <div ng-class="{'has-error': form.password.$error.mongoose}"> 
         <input type="password" 
           class="form-control" 
           placeholder="Password" 
           name="password" 
           ng-model="user.password" 
           required 
           mongoose-error> 
         <p class="help-block" 
          ng-show="form.password.$error.mongoose"> 
          {{ errors.password }} 
         </p> 
        </div> 

        <div class="form-group has-error"> 
         <p class="help-block">{{ error.other }}</p> 
        </div> 

        <button class="btn btn-lg btn-danger btn-block" type="submit"> Sign in </button> 

        <span class="clearfix"></span> 
       </form> 

login.js（控制器）

$scope.login = function(form) { 
     var str = $scope.user.email; 
     Auth.login('password', { 
      'email': str.toLowerCase(), 
      'password': $scope.user.password 
     }, 
     function(err) { 
      $scope.errors = {}; 

      if (!err) { 
      $location.path('/page/1'); 
      } else { 
      angular.forEach(err.errors, function(error, field) { 
       form[field].$setValidity('mongoose', false); 
       $scope.errors[field] = error.type; 
      }); 
      $scope.error.other = err.message; 
      } 
     }); 

感謝幫助。

Answer 1

1. 查看本文討論https://github.com/fnakstad/angular-client-side-auth/issues/58。一種鉻錯誤。

2. 嘗試https://github.com/tbosch/autofill-event。對我的項目工作良好。