Аутентифицировать пользовательский сеанс ASP.NET с помощью JavaScript

Стандартные демонстрации для управления пользователями веб-сайта ASP.NET MVC 3 включают следующий процесс входа в систему:

  1. Пользователь вводит данные авторизации.
  2. Данные публикуются на сервере.
  3. Код, который обрабатывает попытки аутентификации, проверяет предоставленные данные в БД.
  4. Если все в порядке - звонит FormsAuthentication.SetAuthCookieустановить файлы cookie для последующих запросов сеанса из браузера.
  5. И перенаправляет пользователя туда, куда.

Я хочу реализовать чисто jQuery.Ajax - ASP.NET механизм входа в систему.

Я могу назвать действия сайта MVC от JS без проблем. Но как я могу получить это FormsAuthentication.SetAuthCookie данные cookie, чтобы вручную, из кода JS положить их в хранилище cookie браузера? Как мне извлечь их на сервере или в коде успеха jQuery.ajax?

3 ответа

Решение

Используя MVC 3, вы можете установить событие onclick для вашей кнопки входа в систему, а затем отправить и ajax POST для действия входа в систему. Пусть действие Logon возвращает результат JSON и контролирует, куда отправляется пользователь из вашей функции javascript.

[HttpPost]
public JsonResult LogOn(LogOnModel model, string returnUrl)
{
    if (ModelState.IsValid)
    {
        //Do your authentication
        FormsAuthentication.SetAuthCookie(model.UserName, model.RememberMe);
        return Json(true);
    }

// If we got this far, something failed, redisplay form
    return Json(false);
}

В вашем View добавьте Id к вашей форме и поместите обработчик кликов на кнопку.

<% using (Html.BeginForm("LogOn", "Account", FormMethod.Post, new { Id = "frmLogOn" }))
   { %>
    <%: Html.ValidationSummary(true, "Login was unsuccessful. Please correct the errors and try again.")%>
    <div>
        <fieldset>
            <legend>Account Information</legend>

            <div class="editor-label">
                <%: Html.LabelFor(m => m.UserName)%>
            </div>
            <div class="editor-field">
                <%: Html.TextBoxFor(m => m.UserName)%>
                <%: Html.ValidationMessageFor(m => m.UserName)%>
            </div>

            <div class="editor-label">
                <%: Html.LabelFor(m => m.Password)%>
            </div>
            <div class="editor-field">
                <%: Html.PasswordFor(m => m.Password)%>
                <%: Html.ValidationMessageFor(m => m.Password)%>
            </div>

            <div class="editor-label">
                <%: Html.CheckBoxFor(m => m.RememberMe)%>
                <%: Html.LabelFor(m => m.RememberMe)%>
            </div>

            <p>
                <input type="submit" value="Log On" onclick="clicked(); return false;" />
            </p>
        </fieldset>
    </div>
<% } %>
<script type="text/javascript">
    function clicked() {
        var form = $('#frmLogOn');
        $.ajax({
            type: 'POST',
            url: '/Account/LogOn',
            data: form.serializeObject(),
            success: function (result) {
                if (result == true) {
                    alert("success");
                    window.top.location = "/Home/Index";
                }
                else {
                    alert("failure");
                }
            },
            error: function (data) {
                alert("error");
            }
        });
    }
</script>

Установите бета-версию MVC4, шаблон Интернета по умолчанию предоставляет механизм аутентификации Ajax, который вы можете украсть и вставить в свое приложение MVC3.

Или просто используйте MVC4, поскольку, скорее всего, MVC4 выйдет в ближайшие пару месяцев. Существует также действующая лицензия на текущую бета-версию MVC4, так что вы можете даже использовать ее, если хотите.

Другие вопросы по тегам