Проблема на странице входа с использованием аутентификации на основе форм

Question

Мне нужна страница входа, на которой, если какой-либо пользователь введет неверный пароль или имя пользователя после нажатия кнопки «Отправить», пользователю будет показано сообщение об ошибке на той же странице.

Что я должен сделать, чтобы включить это требование? Это возможно с ajax или javascript?

Answer 1

Да, это возможно с Ajax. Честно говоря, проще всего, если вы используете библиотеку, такую ​​как Prototype , jQuery , Closure и т. Д., Потому что они сглаживают различия между браузерами и такие как для вас, и имеют много встроенных функций.

Например, вот довольно лаконичный способ отправки формы и просмотра ответа с помощью Ajax с Prototype:

$('formid').request({
    onSuccess: function(response) {
        // Request succeeded, check result for whether login was valid
    }
});

(Предполагается, что форма имеет идентификатор "formid".)

Вот более полный пример, который также показывает, как вы подключаетесь к процессу отправки. Вы можете вызвать этот код, перехватив событие submit в форме и отправив вместо этого запрос Ajax:

$('formid').observe('submit', function(event) {
    // Prevent the standard form submission
    event.stop();

    // Do it via Ajax instead, including an additional flag telling
    // the server that this is an Ajax call
    this.request({
        parameters: {viaAjax: true},
        onSuccess: function(response) {
            // Request succeeded, check result for whether login was valid
            if (response.responseJSON &&
                response.responseJSON.loginOkay) {
                // Login worked!
            }
        }
    });
});

Вышесказанное делает эти вещи:

1. Подключает обработчик Javascript, когда пользователь отправляет форму
2. Обрабатывает это событие, отменяя обычную отправку формы и отправляя вместо этого вызов Ajax
3. Наряду с данными формы мы также включаем флаг viaAjax, указывающий серверу, что мы отправляем форму через Ajax

Сервер должен ожидать, что форма будет доставлена ​​с флагом viaAjax или без него. Если флаг есть, это означает, что браузер поддерживает Javascript, и форма была отправлена ​​таким образом, и поэтому он должен просто вернуть флаг, сообщающий нам, был ли логин в порядке (в вышеупомянутом я предполагал, что он вернет JSON -форматированные данные {"loginOkay": true}, что означает, что тип контента должен быть установлен на application/json). Если флаг не , Javascript отключен в браузере, и сервер должен обрабатывать отправку формы обычным способом, возвращая полную HTML-страницу. (Эта задача обработки независимо от того, включен ли Javascript, называется «постепенное улучшение» или «постепенное ухудшение».)