Использование reactjs и javascript — Chrome не предлагает запоминать пароли

Привет, я столкнулся с ошибкой, из-за которой Chrome не предлагает запоминать идентификатор пользователя и пароли.

Я попробовал решение по ссылке ниже, но не смог заставить его работать. Кто-нибудь решил это для React? http://code.google.com/p/chromium/issues/detail?id=43219< /а>

Пример кода по запросу: оригинальный обходной путь описан по ссылке выше — я включил сюда: Это ошибка Chrome, и вот рекомендуемый обходной путь: http://code.google.com/p/chromium/issues/detail?id=43219

В дополнение к комментарию № 5, вот более полное объяснение обходного пути, который я тестировал. На странице входа включите форму с двумя элементами ввода. Установите имя и идентификатор одного на «userid», а другого на «пароль». Например.,

<input value type="text" id="userid" name="userid" autocomplete="on">
<input value type="password" id="password" name="password" autocomplete="on">

Дайте форме действие POST на пустую html-страницу, обслуживаемую из того же домена, скажем, blank.html. Установите обработчик onsubmit на функцию JavaScript:

<form name="login" id="login" method="POST" action="blank.html" onsubmit="return do_login();">

Над формой добавьте скрытый элемент iframe, например:

<iframe src="login.html" style="width:0px;height:0px;border:0px;" id="hidden" name="hidden">          </iframe>

Файл login.html также должен обслуживаться из того же домена и содержать ту же форму (те же имена и идентификаторы, то же действие и метод), что и в реальной форме входа. В обработчике JavaScript do_login выполните аутентификацию, как вам нравится. Чтобы Chrome предлагал пользователю сохранить пароль, пусть код JavaScript скопирует значения из реальной формы в скрытую форму, а затем отправит скрытую форму, например:

var userid = document.getElementById("userid").value;
var password = document.getElementById("password").value; 
var iframe = document.getElementById("hidden");
var iframedoc = iframe.contentWindow ? iframe.contentWindow.document : iframe.contentDocument;
var fake_login_form = iframedoc.getElementById("login");
var fake_userid = iframedoc.getElementById("userid");
fake_userid.value = userid;
fake_password.value = password;
fake_login_form.submit();

Протестировано с Chrome 10.0.648.204.

Вот что я сделал для React:

Я создал «пустую форму» и настроил правило nginx:

Включена фиктивная форма входа, которая визуализируется и скрывается: Примечание. Я использую компонент react-frame-component /** * @jsx React.DOM */

'use strict';

var React = require('react/addons');
var Frame = require('react-frame-component');
var Input = require('react-bootstrap/Input');


var DummyLoginForm = React.createClass({

    _onChange: function(){
        console.log('DummyLoginForm onChange called')
    },

    _onSubmit: function() {
        console.log('DummyLoginForm onsubmit called');

        var email = this.refs.userid.getValue();
        var password = this.refs.password.getValue();

        console.log(email);
        console.log(password);
    },

    render: function () {
        var content = ( 
        <div>
            <Frame id="hidden" width="0" height="0" name="hidden">
               <form role="form" name="dummylogin" id="dummylogin" ref="dummylogin" method="POST" action="/login/index.html" onsubmit="return _onSubmit();">
                    <input value type="text" id="userid" name="userid" ref="userid" autoComplete="on" onChange={this._onChange}/>
                    <input value type="password" id="password" name="password" autoComplete="on" onChange={this._onChange}/>
                </form>
            </Frame>
        </div>

        );

        return content;
    }

  /*jshint ignore:end */

});

module.exports = DummyLoginForm;

В реальном модальном окне входа я делаю следующее: Я использую модальное окно react-bootstrap

onSubmit: function(e) {
    if(e && typeof e !== 'undefined') {
        e.stopPropagation();
        e.preventDefault();
        }
        var email = this.refs.email.getValue();
        var password = this.refs.password.getValue();

    MyUtils.login(email, password);

    // workaround to force chrome to prompt to save password details 
    if(BrowserUtils.isChrome()) {

        console.log("Chrome");

        var iframe = document.getElementById("hidden");
        var iframedoc = iframe.contentWindow ? iframe.contentWindow.document :  iframe.contentDocument;
        var fake_login_form = iframedoc.getElementById("dummylogin");
        var fake_userid = iframedoc.getElementById("userid");
        var fake_password = iframedoc.getElementById("password");
        fake_userid.value = email;
        fake_password.value = password;
        fake_login_form.submit();
    }

},

Функция _onSubmit:() в DummyLoginForm не срабатывает