相关疑难解决方法(0)

我在几种形式上遇到了chrome自动填充行为的问题.

表单中的字段都有非常常见和准确的名称,例如"email","name"或"password",它们也有autocomplete="off"set.

自动填充标记已成功禁用自动填充行为,其中在您开始输入时会显示值下拉列表,但未更改Chrome自动填充字段的值.

这种行为是可以的,除了chrome正在填充输入错误,例如用电子邮件地址填充电话输入.客户抱怨这一点,因此经过验证可以在多种情况下进行验证,而不是因为我在我的机器上本地完成了某些事情.

我能想到的唯一当前解决方案是动态生成自定义输入名称,然后在后端提取值,但这似乎是一个非常讨厌这个问题的方法.是否有任何标签或怪癖会改变可用于解决此问题的自动填充行为？

如何判断浏览器是否自动填充了文本框？特别是使用自动填充页面加载的用户名和密码框.

我的第一个问题是在页面加载序列中何时发生这种情况？是在document.ready之前还是之后？

其次,我如何使用逻辑来确定是否发生这种情况？它不是我想阻止这种情况发生,只是挂钩事件.最好是这样的:

if (autoFilled == true) {

} else {

}

如果可能的话,我很乐意看到一个jsfiddle显示你的答案.

可能重复

浏览器密码自动填充的DOM事件？

浏览器自动填充和Javascript触发事件

- 这些问题并没有真正解释触发了什么事件,他们只是不断重新检查文本框(不利于性能!).

在AngularJS中提交表单并使用浏览器记住密码功能时,在后续登录尝试中,您让浏览器使用用户名和密码填写登录表单,$scope不会根据自动填充更改模型.

我发现的唯一脏黑客是使用以下指令:

app.directive("xsInputSync", ["$timeout" , function($timeout) {
    return {
        restrict : "A",
        require: "?ngModel",
        link : function(scope, element, attrs, ngModel) {
            $timeout(function() {
                if (ngModel.$viewValue && ngModel.$viewValue !== element.val()) {
                    scope.apply(function() {
                        ngModel.$setViewValue(element.val());
                    });
                }
                console.log(scope);
                console.log(ngModel.$name);
                console.log(scope[ngModel.$name]);
            }, 3000);
        }
    };
}]);

问题是ngModel.$setViewValue(element.val());不会根据element.val()返回的值更改模型和视图.我怎么能做到这一点？

这与我在这里问的问题有关: 如何让浏览器提示保存密码？

这是问题:我无法让我的浏览器提示我保存我正在开发的网站的密码.(我说的是有时当你在Firefox上提交表单时出现的栏,上面写着"记住yoursite.com的密码？是/现在/从不")

这是非常令人沮丧的,因为Firefox(以及大多数其他现代浏览器,我希望以类似的方式工作)的这一功能似乎是一个谜.这就像浏览器所做的一个神奇技巧,它会查看您的代码,或者您提交的内容,或者某些东西,如果它"看起来"像一个带有用户名(或电子邮件地址)字段和密码字段的登录表单,它提供保存.

除非在这种情况下,在他们使用我的登录表单后,它没有向我的用户提供该选项,这让我很疯狂.:-)

(我检查了我的Firefox设置 - 我没有告诉浏览器"从不"这个网站.它应该是提示.)

我的问题

Firefox使用什么启发式来了解何时应该提示用户保存？这应该不难回答,因为它就在Mozilla源代码中(我不知道在哪里看,否则我会尝试自己挖掘它).我也没有幸运地从Mozilla开发者那里找到博客文章或其他类似开发人员的说明.

(我会很好地回答这个问题用于Safari或IE;我会想象所有浏览器都使用非常相似的规则,所以如果我能在其中一个中使用它,那么它将适用于其他浏览器.)

(*请注意,如果您对我的回答与cookie,加密或其他任何关于我如何在我的本地数据库中存储密码的问题有关,很可能你误解了我的问题.:-)

我正在开发一个以登录门户开头的Angular应用程序.我在登录屏幕上使用以下模板:

的login.html

    <form method="post" name="form" (ngSubmit)="f.form.valid && login()" #f="ngForm" novalidate>
      <fieldset>
        <p>
          <label>Username</label>
          <input type="text" placeholder="e.g. JohnDoe" [(ngModel)]="model.username" #username="ngModel"
                 name="username" required/>
        </p>

        <p [ngClass]="{ 'has-error': f.submitted && !password.valid }">
          <label>Password</label>
          <input type="password" placeholder="Password" name="password" [(ngModel)]="model.password"
                 #password="ngModel" required/>
        </p>
        <p>
        <input type="submit" [disabled]="loading" class="btn" value="Login">
        </p>
      </fieldset>
    </form>

不幸的是,每当用户登录时,Chrome的密码管理器都不会要求存储凭据.像Lastpass这样的密码管理器确实提供存储它.我有什么可以改进来解决这个问题？

我是AngularJS的新手,我正在尝试创建一个简单的表单.如果表单无效(我没有填写所有字段),我将禁用"提交"按钮.当启用自动填充功能时,除Chrome之外,它工作正常.字段已预先填写,但仍然禁用提交按钮,直到我点击页面上的某处(任何位置,即输入字段,空白空间等).

我不确定如何提供复制Chrome场景的工作示例,但这里是ng-disabled的JSFiddle(以及下面的代码).

的jsfiddle

<div ng-app="">
  <form name="myForm">
    <label for="username">Username</label>
    <input type="text" id="username" name="username" ng-model="formData.username" required />
    <span ng-show="myForm.username.$error.required && myForm.username.$dirty">Required</span>


    <label for="password">Password</label>
    <input type="password" id="password" name="password" ng-model="formData.password" required />
    <span ng-show="myForm.password.$error.required && myForm.password.$dirty">Required</span>
    <br />

    <button type="submit" class="btn" ng-disabled="myForm.$invalid">Submit</button>
  </form>
</div>

这是真实的截图:

我在用于登录的部分页面中有以下代码...

<div class="container">
    <form autocomplete="on" data-ng-submit="checkCredentials()" class="form-signin">
        <h2 class="form-signin-heading">Login page</h2>
        <label for="email"> <b>User e-mail</b> </label>
        <input required autocomplete="on" name="email" type="text" data-ng-model="modelLogin.email" class="input-block-level" placeholder="Email address">
        <label for="pass"> <b>Password</b> </label>
        <input required autocomplete="on" name="pass" type="password" data-ng-model="modelLogin.password" class="input-block-level" placeholder="Password">
        <button style="margin-bottom:1em" class="btn btn-large btn-primary" type="submit">Log in</button>
    </form>
</div>

...这是我的唯一主页(index.html)中包含的ng:

<body data-ng-controller="controllerLogin">
    <div data-ng-include="getMainpageBasedOnLoginStatus()">
    </div>
</body>

...与getMainpageBasedOnLoginStatus()函数返回适当的路径要么对泛音/ loginPage.html上面所示或所述的partials/mainApplicationPage.html(我的主要的应用程序的入口点).通过ng-submit完成的checkCredentials()调用执行webservice调用以获取登录成功/失败,并在全局模型变量中进行正确更新 - 以便后续调用getMainpageBasedOnLoginStatus()返回'ok-you-are-登录页面(partials/mainApplicationPage.html).

此登录方案不能被黑客入侵,因为即使客户端代码以某种方式更改为指向主应用程序部分而不是登录部分,服务器端也将无法正常运行(Web服务请求将无法正常运行并返回406错误).

一切都很好 - 它的工作原理.除了...自动填充.

登录/密码字段既不会自动完成,也不会自动填充Chrome 29.在Firefox 23中也是如此:登录/密码字段未自动填充,但登录名(仅登录名,而不是密码名!)是自动填充的 - …