1. Authorize Attributes on Controllers and Actions
2. web.config locations

Yuck! I hate both of them for the same reason: they become very difficult to manage. Authorize Attributes end up spread all over your application and web.config location elements require 7 lines of xml for 1 rule. So I went searching and came across a NuGet package called FluentSecurity.

The documentation covered all the examples I needed and you can define rules in only 1 line of code!

configuration.For.RequireRole("Administrator", "Legal");

I ran into 2 difficulties when trying to implement this:

1. Implementing an Access Denied page and re-direct to Login
2. Integrating FluentSecurity with MvcSiteMapProvider

If you want to skip all the work and get straight to a working example download a sample application here FluentSecurityAndMvcSiteMapProvider.zip

Implementing an Access Denied page and re-direct to Login

The current NuGet version (1.4 as at 05/2012) required that you use StructureMap or another IoC container to implement a custom IPolicyViolationHandler. I wasn’t using either but discovered that it is not a requirement in version 2 which is in alpha at the time of writing but works fine for me. So make sure either the Version you get from NuGet is at least 2.0 or got to GitHub to get the latest version.

First we need to create a class implementing IPolicyViolationHandler.
The class that we create will:

• Send unauthenticated users to a shared view called AccessDenied
• Redirect authenticated users without access to the current controller to the Account controllers LogIn action

using System.Web.Mvc;
using System.Web.Routing;
using FluentSecurity;

public class DefaultPolicyViolationHandler : IPolicyViolationHandler
{
    public string ViewName = "AccessDenied";

    public ActionResult Handle(PolicyViolationException exception)
    {
        if (SecurityHelper.UserIsAuthenticated())
        {
            return new ViewResult { ViewName = ViewName };
        }
        else
        {
            RouteValueDictionary rvd = new RouteValueDictionary();

            if (System.Web.HttpContext.Current.Request.RawUrl != "/")
                rvd["ReturnUrl"] = System.Web.HttpContext.Current.Request.RawUrl;

            rvd["controller"] = "Account";
            rvd["action"] = "LogOn";
            rvd["area"] = "";

            return new RedirectToRouteResult(rvd);
        }
    }
}

Now we need to set / tell FluentSecurity to use our DefaultPolicyViolationHandler. For this I created a SecurityHelper class.

using System.Collections.Generic;
using System.Linq;
using System.Web;

using FluentSecurity;
using FluentSecurityAndMvcSiteMapProvider.Areas.Admin.Controllers;
using FluentSecurityAndMvcSiteMapProvider.Controllers;

public static class SecurityHelper
{
    public static ISecurityConfiguration SetupFluentSecurity()
    {
        SecurityConfigurator.Configure(configuration =>
        {
            // Let Fluent Security know how to get the authentication status of the current user
            configuration.GetAuthenticationStatusFrom(SecurityHelper.UserIsAuthenticated);
            configuration.GetRolesFrom(SecurityHelper.UserRoles);

            // It is reccommended not to use this setting. For all of our applications users must always be authenticated.
            configuration.IgnoreMissingConfiguration();

            configuration.DefaultPolicyViolationHandlerIs(() => new DefaultPolicyViolationHandler());

            //Make sure user must be authenticated but allow unauthenticated access to the logon screen
            configuration.ForAllControllers().DenyAnonymousAccess();
            configuration.For<AccountController>(ac => ac.LogOn()).Ignore();

            //first deny access to all users except Administrators
            configuration.ForAllControllersInNamespaceContainingType<AdminController>()
                .DenyAuthenticatedAccess()
                .RequireRole(RolesEnum.AdminRole.ToString());

            //If any users have access to part of the admin console they will access to the admin dashboard
            configuration.For<AdminController>().RequireRole(RolesEnum.AdminRole.ToString(), RolesEnum.LegalRole.ToString());

            //grant access to any other controllers in the admin area
            configuration.For<LegalController>().RequireRole(RolesEnum.AdminRole.ToString(), RolesEnum.LegalRole.ToString());

        });

        return SecurityConfiguration.Current;
    }

    public static bool UserIsAuthenticated()
    {
        var currentUser = HttpContext.Current.User;
        return !string.IsNullOrEmpty(currentUser.Identity.Name);
    }

    public static IEnumerable<object> UserRoles()
    {
        var currentUser = HttpContext.Current.User;
        return string.IsNullOrEmpty(currentUser.Identity.Name) ? null : System.Web.Security.Roles.GetRolesForUser(currentUser.Identity.Name);
    }
}

Finally configure our system to use FluentSecurity in Global.asax.cs

using System.Web.Mvc;
using System.Web.Routing;

using FluentSecurity;

namespace FluentSecurityAndMvcSiteMapProvider
{
    // Note: For instructions on enabling IIS6 or IIS7 classic mode,
    // visit http://go.microsoft.com/?LinkId=9394801

    public class MvcApplication : System.Web.HttpApplication
    {
        public static void RegisterGlobalFilters(GlobalFilterCollection filters)
        {
            filters.Add(new HandleErrorAttribute());

            //required for FluentSecurity
            filters.Add(new HandleSecurityAttribute(), 0);
        }

        public static void RegisterRoutes(RouteCollection routes)
        {
            routes.IgnoreRoute("{resource}.axd/{*pathInfo}");

            routes.MapRoute(
                "Default", // Route name
                "{controller}/{action}/{id}", // URL with parameters
                new { controller = "Home", action = "Index", id = UrlParameter.Optional } // Parameter defaults
            );
        }

        protected void Application_Start()
        {
            //Configure FluentSecurity
            SecurityHelper.SetupFluentSecurity();

            AreaRegistration.RegisterAllAreas();

            RegisterGlobalFilters(GlobalFilters.Filters);
            RegisterRoutes(RouteTable.Routes);
        }
    }
}

Integrating FluentSecurity with MvcSiteMapProvider

With security working I needed to filter my site map so unauthenticated users can’t see menu items they shouldn’t. Becase we love to user MvcSiteMapProvider I could have easily just added a role attribute to each mvcSiteMapNode but then we are doubling up on security definitions and I just can’t have that.

To hook into MvcSiteMapProvier and use our own Visibility provider we needed to do a few things

• Create a new function in the SecurityHelper to check if a user has access to a particular action
• Create a new class implementing ISiteMapNodeVisibilityProvider

Creating ActionIsAllowedForUser. The one thing that is important to note about this function is that GetContainerFor asks for a parameter named controllerName. This is actually after the controllerNamespace.

public static class SecurityHelper
{
    public static ISecurityConfiguration SetupFluentSecurity()
    {
        //...
    }

    public static bool UserIsAuthenticated()
    {
        //...
    }

    public static IEnumerable<object> UserRoles()
    {
        //...
    }

    public static bool ActionIsAllowedForUser(string controllerNamespace, string actionName)
    {
        var configuration = SecurityConfiguration.Current;

        var policyContainer = configuration.PolicyContainers.GetContainerFor(controllerNamespace, actionName);
        if (policyContainer != null)
        {
            var context = SecurityContext.Current;
            var results = policyContainer.EnforcePolicies(context);
            return results.All(x => x.ViolationOccured == false);
        }
        return true;
    }

Now we can implement a SiteMapNodeVisibilityProvider to call ActionIsAllowedForUser. Lucky MvcSiteMapProvider provides us with this wonderful function that will get the full controller namespace for us!

using System.Collections.Generic;
using System.Web;

using MvcSiteMapProvider;
using MvcSiteMapProvider.Extensibility;

public class ReviumVisibilityProvider : ISiteMapNodeVisibilityProvider
{
    public bool IsVisible(SiteMapNode node, HttpContext context, IDictionary sourceMetadata)
    {
        // Convert to MvcSiteMapNode
        var mvcNode = node as MvcSiteMapNode;
        if (mvcNode == null)
        {
            return true;
        }

        //First check the visibility based on user roles
        string controllerNamespace = (new DefaultControllerTypeResolver()).ResolveControllerType(mvcNode.Area, mvcNode.Controller).FullName;
        bool isVisible = SecurityHelper.ActionIsAllowedForUser(controllerNamespace, mvcNode.Action);
        if (!isVisible)
            return false;

        //Process Other Visibility Rules
        //...

        return true;
    }
}

And that’s it! We now have a site that full implements FluentSecurity for validation, displays the appropriate Access denied or login page and displays the correct site map foe each user.

Checkout a working version here FluentSecurityAndMvcSiteMapProvider.zip

Related posts:

1. Asp.Net MVC convert View to Word Document One request we always seem to come across as developers...
2. Modified properties in LINQ to SQL I’ve been recently quite surprised to learn that there is...
3. Sharepoint – Getting Photos from People and Groups This is another task that seemed to escape me for...

The major purpose of the energy price comparison website is to assist small customers to navigate the often
complex electricity and gas retail markets by allowing them to compare the standing offer prices and market
offer prices available to them from all retailers.

Revium was selected from a number of leading Australian digital agencies. Revium’s Managing Partner, Andrew
Elllet says, “Revium is pleased to partner with the AER to develop this important energy price comparison
website site for all Australians. Revium has a long history of developing tools and resources for the web,
combining our creative and commercial flair with our technical prowess for all things web.”

The Australian Government requires the Australian Energy Regulator (AER) under the Customer Framework to
develop and operate an online energy price comparison service and publish detailed information regarding
energy efficiency generally and electricity bill benchmarking in particular.

The target date for the website to go live is July 1st, 2012.

Related posts:

1. New Products Launch and Redesign of Simply Energy website Over the last few weeks the team has been busy...
2. Simply Energy public website goes CMS After a few months of development and testing efforts Simply...
3. The art of 4 dimensional database design When it comes down to it, a web application is...

In most recent times monitors have increased in size and 21 inch monitors and bigger are very common. This allowed web designers to build websites that show more information at a time to the user and to use striking images in their layout.
Nowadays many websites are having big image slides at the entree and are using big’n’bold fonts. The content is split up in different columns and there is so much content on one page that the mouse wheel has to be oiled properly.

An era of new mobile devices which allowed surfing through the web adequately changed all. Sure, it is easy viewing and navigating the websites with them. But all that zooming and dragging ends in a bad user experience. Especially, if there are elements that are not or just barely accessible by touch interfaces (such as mouse-over menus). Therefore, a lot of companies brought up special mobile sites that were developed exclusively for that new screen size.
But new devices appeared with lots of different resolutions, and every one of these mobile devices can be used in portrait and landscape mode, which would end in an endless development of different mobile sites.

The solution – be responsive

To pay attention to this phenomenon, a new thinking of web design is needed. Today a good web site has to be flexible for the use of different screen resolutions. This new trend is called Responsive Web Design. Thus there is no need to completely redesign the website for each resolution, but the single website has to respond to the user’s device. But what does “respond” mean in this case?

A website can respond in several ways. The most effective way is to hide elements like banners, info boxes and graphical elements completely. Another way to respond is to make the layout flexible to the screen. This means that images don’t have a fixed width, but are growing or shrinking with the screen boundaries (e.g. header images). With special techniques it is possible to load smaller sized versions of the images, so the website will be loaded much faster.
Furthermore, adjoined contents can be reranged to single column to fit most mobile devices dimension. At last but not least, elements and fonts that were designed for large screens can be restyled to more space-saving elements.

And the good thing is: Responsive Web Design is easy to implement from the technical point of view, assume the website structure was set up appropriately, which includes grid layouts instead of table layouts etc. Furthermore, no JavaScript is used. All what is needed is a so-called Media Query (www.w3.org/TR/css3-mediaqueries) and a CSS file that restyles the layout for smaller devices.

For example, let’s use a special “mobile.css” style sheet for resolutions lower than 480px (e.g. iPhones). So the HTML Media Query would look like this:

<link rel="stylesheet" type="text/css"
media="screen and (max-device-width: 480px)" href="mobile.css" />

Additionally to the ordinary media type “screen” a “max-device-width” can be defined. This condition can also be set for “device-width” and “orientation” (landscape/portrait). This is possible in an existing style sheet too, as following:

@media only screen and (max-device-width: 480px) {
/* style content */
}

Most browsers are supporting Media Queries. The most well-known exceptions are the Internet Explorer older than version 9. Regarding browsers on mobile devices this is no problem as mobile devices are usually updated well and have originally modern browsers. If there is nevertheless support for older Internet Explorer versions needed, a special JavaScript framework can fix this for you (http://code.google.com/p/css3-mediaqueries-js/).

We are responsive

Normally, it is good to take account of Responsive Web Design at the beginning of the conceptual phase, so the layout can be built for lower screens and then elements are added step-by-step for larger screen resolutions.
But it is also possible to take an existing website and make it responsive. How easy this undertaking would be depends on the structure and the content of the website.

We did this for example for one of our product sites on www.abstractsmanager.com. At the beginning, the structure had to be analysed and weighted for the importance of the different elements.

abstractsmanager.com website

As mentioned before, there are several ways to make a site responsive. So we decided to remove the upper teaser and remove some additional info, which is not crucial to know. For better overview, the different columns have been rearranged among each other and use now the full available width of the device. At last, some parts of the footer content were stashed. The sitemap in the footer is still there in the lower resolutions, as it is a good user experience because the user doesn’t have to scroll up again to navigate to other pages.

A big issue was that the title background graphics all had fixed sizes, which does not allow adjusting the width to the screen width. Fortunately, modern browsers as those of mobile devices allow CSS3. By dint of CSS3 the gradients and round corners can all be integrated with CSS styles.

abstractsmanager.com structure modification

Afterwards, just a few styles for the forms and listings had to be made. But all in all, just one CSS file was added and the Media Query was put into the header. No content changes were made, no tags were added, all CSS.

abstractsmanager.com - Responsive layout

Should you be responsive too?

As said at the beginning, modern devices allow accessing webpages adequately. However, there is a huge amount of new devices coming out and the website should be tested at least on smaller screens. There is always somebody with a smart phone or a tablet around the corner.
Nevertheless, statistics state that mobile users have high expectations when they surf through the web, first and foremost in case of speed. This statistics have shown that 59% of the users are leaving if the page has not loaded within 5 seconds and most users are expecting a load time of 3 seconds or less. With smaller and fewer graphics the site speed can be increased a lot. A good styled and formatted content for a better readability on mobile devices would help the user and increase the user experience additionally.

Links

• http://caniuse.com/#feat=css-mediaqueries
• http://coding.smashingmagazine.com/2011/01/12/guidelines-for-responsive-web-design/
• https://ilocalsearch.net/what-do-mobile-users-want

Related posts:

1. Creating deployment packages in SVN In software development (in an ASP.NET web development in particular)...
2. Developing faster web forms in .NET Quite often, I develop web forms containing  heavy elements, in...
3. Structured structure through card sorting From personal and professional experience, website’s that provide information in...

Revium is looking forward to working with Vermont Consulting in the future to further improve the Eqitas system.

Related posts:

1. Revium is born. At 1 minute past midnight today, a new company named...
2. Destination Melbourne new site launched! After working closely with the team at Destination Melbourne for...
3. MTData Australian and British sites launched! Revium has been working closely with the MTData team since...

Related posts:

1. New project with Financial Ombudsman Service We recently kicked off a new project with the Financial...
2. Email source code in MS Outlook The Problem I’m sure some of you may have been...
3. New Aequus website goes live Revium are excited to announce the launch of the new...

Revium has been delivering successful custom software development services and a trusted web advisor to Victorian organisations for over a decade. Revium’s panel term runs until 30 June 2014, with a possibility of two one-year extensions. Being a member of these panels highlights Revium’s specialist knowledge, capability and credibility in providing services in the Government arena and confirms its position as a leading IT provider.

Related posts:

1. Collaborating with Government Revium is actively involved in the Federal Government’s R&D program...
2. Revium End of Year Party Seeing as we all worked so hard during the year,...
3. How much does the media and government effect our business confidence? Have you noticed the GFC? And I don’t mean the...

Revium designed and developed a brochure website to promote the lead up to the 2012 London Olympics for the BelcherPage2012 team. Mat and Malcom were seeking a solution that not only provided information about the team, but also had a strong focus on social media.

Make sure you view the website www.belcherpage2012.com and don’t forget to cheer on Mat and Malcom in the 2012 London games.

Related posts:

1. Basic introduction: 3 ways to get website traffic – Part 3 There is one common characteristic that exists in both buying...
2. New Aequus website goes live Revium are excited to announce the launch of the new...
3. Social Media – a fad or here to stay? Whilst attending International Customer Service Week there were a lot...

Tangshan Burak is an Australian owned company based in Tangshan, China. Tangshan Burak manufactures a complete range of Buffet Fuel, Liquid Wax Cartridges, Table Lamps, The Anywhere Anytime Stove, The Anywhere Anytime Buffet for the Hospitality and Retail Trade.

Revium is about the start SEO for the new website and is looking forward to working with Tangshan Burak on this project.

Make sure you browse their site and tell us what you think!  www.tangshanburak.com

Related posts:

1. Revium launch new Autism Victoria website, www.amaze.org.au Revium invite you to visit the new Autism Victoria website,...
2. New Aequus website goes live Revium are excited to announce the launch of the new...
3. PaceDG Website Launch Last week, Revium were proud to launch a new website...

After 3 three months of hard work, it gives us great pleasure to launch the new website for Autism Victoria, who are a long standing client of Revium. The new solution is powered by a WordPress CMS and includes features such as a news feed, events calendar and eCommerce to handle donations.

Autism Victoria have had a great relationship with Revium and we look forward to working with them well into the future.

The new Amaze site went live late in September. To view the site please visit http://www.amaze.org.au

Related posts:

1. PaceDG Website Launch Last week, Revium were proud to launch a new website...
2. New Products Launch and Redesign of Simply Energy website Over the last few weeks the team has been busy...
3. New Aequus website goes live Revium are excited to announce the launch of the new...

Method that works but isn’t ideal

Initially is commented out the HandleErrorAttribute filter in Global.asax and added a customError handler with defaultRedirect=”~/Error” in our web.config.

public static void RegisterGlobalFilters(GlobalFilterCollection filters)
{
   //filters.Add(new HandleErrorAttribute());
}

This seemed to make everything work ok. But after some consideration i decided this isn’t ideal because the correct http codes are never sent to the browser. So I decided to dig a little deeper.

So why dosen’t Application_Error fire?

The best explanation if found for this was on stack overflow: Application_Error not firing when customerrors = “On”. Specifically this excerpt:

By default (when a new project is generated), an MVC application has some logic in the Glabal.asax.cs file. This logic is used for mapping routes and registering filters. By default, it only registers one filter: a HandleErrorAttribute filter. When customErrors are on (or through remote requests when it is set to RemoteOnly), the HandleErrorAttribute tells MVC to look for an Error view and it never calls the Application_Error() method. I couldn’t find documentation of this but it is explained in this answer on programmers.stackexchange.com.

None of the solutions I saw in that post looked particularly appealing so I looked at how other error logging frameworks were used with MVC3. That is when I came across this solution using ELMAH: ASP.NET MVC Magical Error Logging with ELMAH. Specifically Step 4 where they create a class that implements IExceptionFilter.

I just created a similar class that worked with log4net and have been living the logging dream since.
Here is the full solution:

log4netExceptionFilter.cs

using System;
using System.Web.Mvc;

public class log4netExceptionFilter : IExceptionFilter
{
    public void OnException(ExceptionContext context)
    {
        Exception ex = context.Exception;
        if (!(ex is HttpException))	//ignore "file not found"
        {
            Logging.PutError("Unhandled exception error", ex);
        }
    }
}

Loggin.cs

using System;
using System.Configuration;
using log4net;
using log4net.Config;

public static class Logging
{
    private static readonly ILog Log = LogManager.GetLogger(ConfigurationManager.AppSettings["log4netLogger"]);

    public static void PutError(string message, Exception e)
    {
        Log.Error(message + "; Url: " + HttpContext.Current.Request.Url.AbsoluteUri + "; Error: ", e);
    }

    // Other Custom Logging Functions

}

Global.asax.cs

public static void RegisterGlobalFilters(GlobalFilterCollection filters)
{
    filters.Add(new log4netExceptionFilter()); //must be the first line
    filters.Add(new HandleErrorAttribute());
}

Related posts:

1. ASP.NET MVC [HandleError] and logging Recently I’ve been a bit surprised to find out that...
2. FluentSecurity + MvcSiteMapProvider = Better .Net Security Management In my continual quest for find better ways of doing...
3. Power of the ASP.NET MVC + jquery What a hectic couple of last months we have had...