Authorized page redirects back to login after successful login

In your Github project, you have a site.js file that contains (amongst other things), the following jQuery event-handler:

$('form[method=post]').not('.no-ajax').on('submit', function () {
    ...

    $.ajax({
        url: $this.attr('action'),
        ...
        statusCode: {
            200: redirect
        },
        ...
    }).error(highlightErrors);

    return false;
}

When you submit your login form, you end up running through this block of code above, which then invokes your redirect callback function for a statusCode of 200, shown below:

var redirect = function (data) {
    if (data.redirect) {
        window.location = data.redirect;
    } else {
        window.scrollTo(0, 0);
        window.location.reload();
    }
};

In the scenario you've described, data.redirect is undefined. In that case, you end up calling window.location.reload(), which, of course, reloads the login page and explains the issue you've been having clearly.

Here's a step-by-step breakdown of what happens:

1. The submit event is triggered when clicking "Log In".
2. The browser-based POST is intercepted, being sent instead as an XHR request.
3. The server logs in the user, assigns the cookie and returns a 302 response for redirecting to /Home/About.
4. The XHR internal mechanics follows the redirect and pulls down the HTML for the /Home/About page.
5. Your Javascript redirect callback is invoked where data represents the response to the /Home/About page (the text/html response).
6. Finally, whilst still on the /Account/Login page, the page is reloaded as described above.

Due to how you've set up the jQuery selector shown in the first code snippet, you can simply add the no-ajax class to your login form and it will behave as expected.