Sunday, 4 March 2018

Automatically logout when user is idle for sometime using JQuery.

       
             In this article, we shall learn how to automatically logout user when he/she is idle for certain amount of time in the web application.
To make it efficient and easy, we shall use jQuery to achieve this functionality.

Below is the <script> code. This should ideally be kept inside the _Layout/Master/Template page so that this code executes in almost all pages of the application.

In this code, we are adding first referencing to the jQuery page.
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>

<script type="text/javascript">

        idleTimer = null;
        idleState = false;
        idleWait = 900000;

        (function ($) {

            $(document).ready(function () {

                $('*').bind('mousemove keydown scroll', function () {

                    clearTimeout(idleTimer);

                    idleState = false;

                    idleTimer = setTimeout(function () {

                        // Idle Event
                        $.ajax({
                            contentType: 'application/json',
                            type: 'POST',
                            url: '../Default.aspx/ButtonLogOut_Click',
                            data: JSON.stringify({}),
                            success: function (myData) {
                                window.location = "../Default/Home.aspx";
                            },
                            error: function (textStatus, errorThrown) {
                            }
                        });
                        idleState = true;
                    }, idleWait);
                });

                $("body").trigger("mousemove");

            });
        })(jQuery);
    </script>

Feel free to download the source code.

Hope you liked this article, do share to your friends, colleagues and social websites.

No comments:

Post a Comment