Iron Speed Technical Forums
Register Latest Topics
 
 
 


Reply
  Author   Comment  
echo4sos

Avatar / Picture

MVP Developer
Registered:
Posts: 172
Reply with quote  #1 

Session Timeout control with Telerik RadNotification

       -Extending security in an Iron Speed Application

A different approach to meeting customer needs through the flexibility of Iron Speed Designer.

Bill Goodwin

February 1, 2013

Iron Speed Designer v9.x

Introduction

Some time ago I ran across an article by Kenneth Scott describing how he developed a Session Timeout control using jQuery (article link here). Within the comments of the article there was a discussion of incorporating Telerik’s RadNotification control with Kenneth’s custom timout control. I will demonstrate in this article how to accomplish this.


What you need

To follow this example, you should have a moderate knowledge of both Iron Speed and Telerik RadControls. This sample is built using Iron Speed version 9.2.0. You will also need Telerik RadControls for ASP.Net Ajax (I am using version Q3 2012 SP2 as of the time of writing this article). You will also need to reference a jQuery library (I am using a jQuery CDN as of the time of writing this article). Kenneth Scott’s Session Timeout control can be downloaded from here. This control was developed using Visual Studio 2010 and the 4.0 .Net Framework. Once downloaded and extracted, you will only need the AjaxControls.dll file.

 

Implementation

The sample application uses the Session View State (from within Iron Speed…BuildàPerformance TuningàSession). I have also selected Database for User Authentication (from within Iron Speed…ToolsàApplication Security WizardàDatabase). Once we have our security set up, we can then start customizing the application.

The first thing we’ll do is create a duplicate default master page. We need to do this so we can set our SignIn and SignOut pages to use a different master page. This is because we want our Session Timeout control to be included in our applications main default master page. So, right click on your default master page and select “Create a Duplicate” (figure 1)
 


Figure 1. Create a Duplicate Master Page

Once you’ve created your new master page, rename it. I usually rename mine to “Security.master”. Build your application to create the new master page. Now we will assign this master page to our SignIn and SignOut pages. Go to the Page properties for your SignIn and SignOut pages and change the master page to your newly created master page (figure 2)

Figure 2. Assign new master page to SignIn and SignOut pages

Build your application to save the changes. Go to your SignOut.aspx page and right click in any cell to bring up the Page Directives dialog. We need to insert the following code after the Content tag but before the StartOfPageContent tag:

Quote:

<meta http-equiv="refresh"content="15;url=SignIn.aspx">

<script type="text/javascript"language="javascript">

      javascript:window.history.forward(1);

</script>

 

 

The meta tag will redirect our signed-out users back to the sign in page. The javascript will prevent our users from navigating backwards once they have been signed out. Save your changes and Build your application.

Copy the extracted AjaxControls.dll file from Kenneth Scott’s example and paste it into your application’s bin folder.

Once copied, switch back to Iron Speed and go to your original default master page. Right click in any cell to bring up the Page Directives. Insert the following code at the top of your page prologue (before the DocType declaration):

Quote:
<%@RegisterAssembly="AjaxControls"Namespace="AjaxControls"TagPrefix="ctl"%>


This will reference the AjaxControls.dll copied to your bin folder.

Copy and paste the following code after the end head tag but before the body tag in your page prologue:

Quote:

<script runat="server">

 

Public Property TimeoutControlEnabled() As Boolean

       Get

             Return Timeout1.Enabled

       End Get

       Set

             Timeout1.Enabled = value

       End Set

 End Property

 
' can be used to access the clientid from content pages

 Public ReadOnly Property TimeoutControlClientId() As String

       Get

             Return Timeout1.ClientID

       End Get

 End Property

 </script>

 <script src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.8.1.js"type="text/javascript"></script>



Since we don’t have a code-behind page for master pages we need to declare our object properties via in-line coding. This gets and sets the properties of our Session Timeout control. Also, we have now referenced a jQuery CDN to use in our application. Save and Build your application.

Go to the PageContent cell of your master page. Copy and paste the following code after the ContentPlaceHolder tag:

Quote:

 

<ctl:Timeout id="timeout1" runat="server" TimeoutUrl="../Security/SignOut.aspx" CountDownSpanId="countDown1"/>

 

<telerik:RadNotification ID="timeoutPopup" runat="server" Position="Center" Width="240" Height="150" Title="Session Expiring" EnableRoundedCorners="true" AutoCloseDelay="0">

<ContentTemplate>

<div style="font-weight: bold;">Your session is about to expire.

<br />

<br />

Automatic logout in...<span id="countDown1"></span>&nbsp;seconds.

<br />

<br />

Click <a href="#" onclick="$find('ctl00_timeout1').reset();">OK</a> to continue your session.

</div>

</ContentTemplate>

</telerik:RadNotification>

<telerik:RadCodeBlock ID="rcb1" runat="server">

<script type="text/javascript">

if (typeof AjaxControls != 'undefined') { // (won't be here on the Timeout page)

AjaxControls.Timeout.prototype.hide = function () { $find("<%=timeoutPopup.ClientID%>").hide(); }

AjaxControls.Timeout.prototype.show = function () { $find("<%=timeoutPopup.ClientID%>").show(); }

}

</script>
</
telerik:RadCodeBlock>

 


We are adding the Session Timeout control to our page. We are also adding our Telerik RadNotification control to the page and referencing jQuery functions within a RadCodeBlock to either hide or show our RadNotification. Save and Build your application. At this point you will need to reference the Telerik dll’s with the Iron Speed application. I will not explain how to do this at this point, as you should already be familiar with deploying Telerik dll’s to your application’s bin folder.

Next, within Iron Speed, open up your web.config file. Go to the sessionState tag and change the timeout property to “2”. By default it is set to “60” but we are changing this to test our Session Timeout control.

Save and Build your application. Run your application and sign into your application. After 1 minute, you should receive a Telerik RadNotification pop-up warning you that your session is set to expire (figure 3).

Figure 3. RadNotification pop-up

Conclusion

I have demonstrated how to use Kenneth Scott’s Session Timeout control in conjunction with Telerik’s RadNotification control within an Iron Speed application. Iron Speed Designer is very flexible and accepting of various customizations. Iron Speed Designer creates the framework, you supply the imagination!

I hope you enjoyed this article. If you have any questions or comments, feel free to post them in this article’s forum page.

Attached Images
Click image for larger version - Name: fig1.jpg, Views: 1568, Size: 39.44 KB  Click image for larger version - Name: fig2.jpg, Views: 1547, Size: 21.00 KB  Click image for larger version - Name: fig3.jpg, Views: 1567, Size: 14.71 KB 

__________________
-Bill

pinbot

Avatar / Picture

MVP Consultant
Registered:
Posts: 952
Reply with quote  #2 
Bill,

Excellent!

Seeing as how I just purchased Telerik's controls last week I believe I will implement this immediately.

My users's will love it.

Thanks,

__________________
C. Bryan Patrick II
Iron Speed Designer MVP Consultant
Pseudo Consulting
JimiJ

Avatar / Picture

MVP Developer
Registered:
Posts: 1,948
Reply with quote  #3 
Looks great! Thank you Bill.
__________________

  Jaime Jegonia
[jts_logo]

Iron Speed MVP Developer
 

". . . and whoever sows generously will also reap generously" 2 Cor 9:6

echo4sos

Avatar / Picture

MVP Developer
Registered:
Posts: 172
Reply with quote  #4 
Thanks for the compliments! If you have any issues or if I've missed anything, let me know.


__________________
-Bill
pk_davidson

Registered:
Posts: 223
Reply with quote  #5 
Well done and helpful.
I've been using the Time out method of Ding Jing (actually he just brought it to our attention).
If you're familiar with that, do you see any advantage to either of these methods over the others ?

One thing I have noticed with the prior method is that it continues to fire off if you stay on the ISD web pages even after it logs you out.  not a big deal but...

__________________
Paul
echo4sos

Avatar / Picture

MVP Developer
Registered:
Posts: 172
Reply with quote  #6 
As far as advantages go, it really comes down to a matter of preference and this tutorial is directly aimed at users of the Telerik .NET controls. In all, I just really wanted to demonstrate combining elements of jquery, RadControls and Iron Speed.

Thanks for the compliment!

__________________
-Bill
dougkillmer

Registered:
Posts: 24
Reply with quote  #7 
Thanks Bill, this is exactly what I was after!

My application is running in 10.0.2 with VS2012 and .NET 4.5 and I found that I had to make the following modifications to get it to work in my environment:

Removed this code from the SignOut.aspx page directives (This didn't work right):
Code:
<meta http-equiv="refresh"content="15;url=SignIn.aspx">
<script type="text/javascript"language="javascript">
      javascript:window.history.forward(1);
</script>


I registered the control in my web.config instead of the masterpage (I prefer to put them here):
Code:
<controls>
<add tagPrefix="asp" namespace="System.Web.UI.DataVisualization.Charting" assembly="System.Web.DataVisualization, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" />
<add tagPrefix="telerik" namespace="Telerik.Web.UI" assembly="Telerik.Web.UI" />
<add tagPrefix="ctl" namespace="AjaxControls" assembly="AjaxControls" />
</controls>


Removed this code from the Security.master page directives (This caused errors in my app):
Code:
<script src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.8.1.js"type="text/javascript"></script>
mfsumption

Avatar / Picture

Registered:
Posts: 60
Reply with quote  #8 
@dougkillmer: Yes, I needed to make the same modifications that you mentioned as well. However, after the timeout, I noticed that I could still hit the back button and see the prior page, though if I tried to access anything then it would redirect to the Sign In page due to security. Did you get that scenario also and figure out a solution to negate the back button? Thanks.
__________________
Regards,
Michael Sumption
GovIS, LLC
dougkillmer

Registered:
Posts: 24
Reply with quote  #9 
Hi Michael,

Yes, I'm seeing the same behavior that you mention.  After I'm taken to the Sign-Out page, I can use by browser 'Back' button to navigate to a cached version of the previous page.  If I attempt to refresh that page, I'm prompted to Sign-In again.  This isn't a major issue for my application, but you're right, it would be nice to prevent use of the 'Back' button.

Doug
echo4sos

Avatar / Picture

MVP Developer
Registered:
Posts: 172
Reply with quote  #10 
Hey guys,

I haven't been able to test this with 10x just yet. Presently, I have no need to utilize Iron Speed 10, as our company standard is IE 8 . If I get a chance to play around with this I will post my results as soon as I can. Since the initial writing of this article, I have changed some of the code structure from the original. I'm not sure if that would make any differrence, but again, I'll try to test this out as soon as I can.

__________________
-Bill
Previous Topic | Next Topic
Print
Reply

Quick Navigation:

Download Iron Speed Designer

Terms of Service Privacy Statement