在Firefox中保存的密码发送空字段 [英] Saved password in Firefox send empty fields
问题描述
我有浏览器证书保存问题。第一次,我和我的应用程序登录,浏览器问我救场,我preSS确定,但是当我登录第二次和浏览器fullfill表单字段使用保存的凭证,我preSS登录,浏览器发送不带参数的请求。
I have a problem with the browsers credentials saving. The first time that I login with my app, the browser ask me to save the fields, I press ok, but when I login the second time and the browser fullfill the form fields with the saved credentials, I press login, and the browser send a request without parameters.
<div ng-controller="modalCtrl">
<script type="text/ng-template" id="login">
<form ng-submit="login()" class="login">
<input type="text" ng-model="data.username" placeholder="username" value="username" class="form-control" popover="inserisci qui il tuo username" popover-trigger="focus" popover-placement="right"/><br>
<input id="pwd" type="password" ng-model="data.password" placeholder="password" value="password" class="form-control" popover="inserisci qua la tua password" popover-trigger="focus" popover-placement="right"/><br>
<input class="btn-primary btn-lg" type="submit" value="Login">
</form>
</script>
</div>
JS
modalController.controller('modalCtrl',function ($scope, $modal) {
var open = function () {
var modalInstance = $modal.open({
templateUrl: 'login',
controller:this.loginCtrl,
backdrop:'static'
});
};
open();
});
var loginCtrl = function ($scope, $http, $modalInstance, $state) {
$scope.data = {username: this.username, password: this.password};
var data = $scope.data;
$scope.login = function () {
$http.post(server[0] + '/bbi-api/sauth/1', {name: data.username, password: data.password})
.then(function () {
$state.go('home');
$modalInstance.close();
},
function (response) {
alert(response.status);
});
};
};
但奇怪的是,如果我重写凭据一切正常的话,但如果我只是preSS通过浏览器把凭据按钮,应用程序发送了一条信息空白的参数。
The strange is that if I rewrite the credentials everything goes ok, but if I simply press the button with the credentials put by the browser, the app send a post with blank parameters.
推荐答案
的问题是,浏览器的自动填充不触发正确的事件,以便能角度绑定到它。
The problem is that the browsers' autofill is not triggering the correct event so that Angular can bind to it.
解决方案之一是触发您的输入变化的事件,这里是我的指令从这里定制(的http://victorblog.com/2014/01/12/fixing-autocomplete-autofill-on-angularjs-form-submit/):
One solution is triggering a change event for your inputs, here is a directive I customized from here (http://victorblog.com/2014/01/12/fixing-autocomplete-autofill-on-angularjs-form-submit/):
CoffeeScript的:
Coffeescript:
angular.module('app')
.directive 'formAutoFillFix', ->
(scope, elem, attrs) ->
# Fixes Chrome bug: https://groups.google.com/forum/#!topic/angular/6NlucSskQjY
elem.prop 'method', 'POST'
# Fix autofill issues where Angular doesn't know about autofilled inputs
if attrs.ngSubmit
setTimeout ->
elem.unbind('submit').bind 'submit', (e) ->
e.preventDefault()
elem.find('input').triggerHandler('change')
scope.$apply attrs.ngSubmit
, 0
使用Javascript:
Javascript:
angular.module('app').directive('formAutoFillFix', function() {
return function(scope, elem, attrs) {
// Fixes Chrome bug: https://groups.google.com/forum/#!topic/angular/6NlucSskQjY
elem.prop('method', 'POST');
// Fix autofill issues where Angular doesn't know about autofilled inputs
if(attrs.ngSubmit) {
setTimeout(function() {
elem.unbind('submit').bind('submit', function(e) {
e.preventDefault();
elem.find('input').triggerHandler('change');
scope.$apply(attrs.ngSubmit);
});
}, 0);
}
};
});
公布在该网站上该解决方案使用jQuery,而上面的解决方案不依赖于它。
The solution posted on that website uses jQuery, whereas the above solution does not rely on it.
使用它,就像任何其他指令:
Use it as you would any other directive:
<form role="form" ng-submit="login()" form-auto-fill-fix>
这篇关于在Firefox中保存的密码发送空字段的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!