Pawan Nogariya
Pawan Nogariya

Reputation: 8960

How to handle session timeout in MVC3 in javascript?

In my application this is how we are dealing with the session timeout till now

<authentication mode="Forms">
    <forms loginUrl="~/Account/LogOn" timeout="20" />
</authentication>

Now I want to deal session time out on client side, something like this

<authentication mode="Forms">
   <forms loginUrl="showPopup();" timeout="20" />
</authentication>

Is that possible, or any other suggested way to achieve this?

Edit

I visited to other questions of the same type but could not get any real help from them.

Upvotes: 1

Views: 2618

Answers (2)

Darin Dimitrov
Darin Dimitrov

Reputation: 1038810

In my application this is how we are dealing with the session timeout till now

Great, that's the correct way to define forms authentication in web.config

Is that possible

No, sorry, putting javascript in the loginUrl attribute is meaningless.

or any other suggested way to achieve this

From what I understand you are trying to display the LogOn form using some javascript function if the session has expired.

You should distinguish between 2 types of request to your server:

  1. Standard synchronous requests (anchors, forms, redirects, ...)
  2. Asynchronous requests (AJAX - done by using javascript)

In both cases on the server side you should protected actions that require authentication by decorating them with the [Authorize] attribute. For example:

[Authorize]
public ActionResult SomeAction()
{
    ...
}

Once you have secured your server you could start thinking about how to handle forms authentication cookie expiration or simply the case of an anonymous user attempting to call this action.

For the first case of standard synchronous calls to the server, the forms authentication module will intercept the request and if the user is not authenticated or his session expired ASP.NET will automatically redirect you to the LogOn page you have defined in the loginUrl attribute. It will also pass as a ReturnUrl query string parameter to this action which will be pointing to the originally requested url by the user and for which he was not authorized yet. This parameter could then be used to redirect him back to this page once he has authenticated.

Now the second case is a bit more difficult because since ASP.NET automatically redirects the request to the LogOn page you have no way of knowing inside your AJAX success callback that the user is not authorized and the server redirected the request to the LogOn page. Phil Haack wrote an excellent article on how you could prevent this redirect for AJAX request. I invite you to read this article now.

Alright, now that you have read the article and have installed his NuGet (Install-Package AspNetHaack), assuming you are using jQuery for your AJAX requests, you could subscribe to the .ajaxComplete() global event handler. Inside this handler you could test the server response code and if it is 401 it means that the user was not authorized. So you could act accordingly:

<script type="text/javascript">
    $(document).ajaxComplete(function(event, xhr, ajaxOptions) {
        if (xhr.status == 401) {
            // the AJAX request failed because either the user was not
            // authenticated or his session expired. So here you could
            // do whatever you want. For example you could redirect him
            // to the loginUrl defined in your web.config file:

            window.location.href = '@FormsAuthentication.LoginUrl';

            // you also have the possibility to show this logon form
            // inside a popup or render it inline inside the page,
            // by sending an AJAX request to this action and retrieving the
            // corresponding partial
        }
    });
</script>

Upvotes: 2

Adrian Thompson Phillips
Adrian Thompson Phillips

Reputation: 7141

This configuration area is to configure server side behaviour, that happens when the server tries to handle a request where the session has expired. It is the result of a client -> server request for a page. As the client is a web browser and is by design disconnected from the server, you would have to include the logic you require in each page (probably in the main layout template) and then make AJAX calls at repeating intervals to the server to ascertain the user's session time-out state. The pop-up would also be handled on the client.

This area of configuration probably isn't going to help you reach your goal, I'd just remove the <forms> element altogether and look at solving the problem using AJAX calls to the server.

Upvotes: 0

Related Questions