webmatrixLast weekend, my team used WebMatrix to write a Website that included user registration, admin pages, user sign up/profile pages, and some dynamic content.

We did the project over a weekend at GiveCamp. GiveCamp is a weekend event where people who know technology work with non-profits who have technology needs. The team of Ryan Kyle, Robert Seaborn, and I worked on a Website project for Boys & Girls Club of King County. So we had a limited amount of time.

The Club needed a way to sign up teens who are interested in summer jobs. The site needs to be secure. And only the teen should see their own information and the Site admin should be able to view information.

Why We Chose WebMatrix

We selected WebMatrix for many reasons, including:

  • Developer tool is free. That means that neither Boys & Girls Club nor us developer needed to invest money in developer tools.
  • Quick light-weight prototyping. Easy Razor syntax made it quick to get a site up and running. Easy to learn. No one on the team had used Razor with C# before.
  • Ability to migrate the database from SQL Compact to SQL Azure at some point in the future.
  • Ability to migrate the project to Visual Studio when we needed better tools than was provided out of the box.
  • Ease of designers to make the site look great using their knowledge of HTML, CSS, without wrecking our carefully crafted code.
  • Identity provider already included in initial Website template.

Membership Provider

Key to our selection for WebMatrix was how easy it was to incorporate role-based identity into our application. When you choose the sample template, you get a sample Website, with a light-weight ASP.NET Membership Provider, including all of the log in, log out functionality. Your user can register, sign in, reset password. And it automatically times out when someone tries their password too many times.

We needed two important features.

  1. Users should see only their registration information and not someone else’s registration.
  2. We wanted Admins to see certain functionality and restrict access to other users.

Getting Started with WebMatrix

The documentation is a great place to get started using WebMatrix. You get instructions on how to create a basic line-of-business application. And we were able to duplicate the four pages of CRUD (Create, Retrieve, Update, and Delete) in around three hours for a simple set of pages.

Although everyone on the team has some experience with ASP.NET, it was quick and easy. 

So we start with our page that we want to restrict access to.

Only the Admin Can See the Data

The idea is to have so one part of a Web page to the user and a different one to the user. For example, the admin can see a list of all the user names, while the users might see just their own. You’d like to do this on the server, behind the firewall to limit hacking.

And for additional security, we liked the idea of never even showing the user their ID number that we use. Instead, we just serve up their registration data based on their log in.

The tutorial assumes you are familiar with WebMatrix. If you are new to WebMatrix, start with the WebMatrix documentation.

Do add this kind of functionality to your WebMatrix project:

Step 1. Register the user you want to be the admin.

Run your site and click Register. Follow the steps you usually take to sign up on a Website.

image

Look up your UserID that corresponds to the email you added.

My UserID is test@testme.com.

Open the database. Expand your database to see the tables. Right click the UserProfile table and click Data to inspect the date in the table. You want to get the UserId.

image

Step 2. Add an admin role to your provider.

Just add a row to the webpages_Roles table. Type Admin in the RoleName column. It will create your RoleID. Remember your RoleID value. My value is 1.

image

Step 3. Add a row to join the user as an admin.

Add a row to the webpages_UsersInRoles table. Type in your RoleId and your UserId.

image

So now you have your user associated as an Admin role.

Step 4. Add a C# class.

Add a folder named App_Code. Right click on the project name, click New Folder… . Rename the folder to App_Code. Right click on the App_Code folder. Click New File…. Click Class (C#) icon. Name the file WebSecurityExt.cs. Replace the code in your class with the following code. (Tailor to meet your needs.)

using System;
using WebMatrix.WebData;
using WebMatrix.Data;

/// <summary>
/// Class provides static methods to
/// </summary>
public class WebSecurityExt
{
    /// <summary>
    /// Gets whether the current user is listed as an admin in the roles table.
    /// </summary>
    /// <returns>true if the current user id has Role ID = 1 in the
    ///
webpages_UsersInRole table, otherwise false.</returns>
    static public bool IsAdmin
    {
        get
        {
            // get the current user ID
            int userID = WebSecurity.CurrentUserId;
           
            if (userID == -1)
            {
                // if the user does not exist, return not admin

                return false;
            }

            // see if the user matches the RoleID you have for Admin
            var db = Database.Open("StarterSite");
            var SQLSELECT = "SELECT RoleID FROM webpages_UsersInRoles “ +
            "
WHERE UserID=@0";
            var UserInRole = db.QuerySingle(SQLSELECT, userID);
            if (UserInRole.RoleID == 1)
            {
                return true;
            }
            else
            {
                return false;
            }
        }
    }
}

Step 7. Bracket the HTML with a call to SecurityExt class.

Inside your HTML page, you’ll have a place where you want to show your Admin one set of information and your users some other data. You can bracket your HTML with the code in the Razor syntax.

@if (WebSecurityExt.IsAdmin)
{
    <p>For the admin only></p>
}
else
{
    <p>You do not have permission to edit a job.</p>
}
</form>

Step 8. Do not ship your product with your test users with admin privileges.

Be sure to clear out your test users from your database before you ship. Remove the user from User Profiles and the user from webpages_Membership, and most importantly webpages_UsersInRoles tables.

Conclusion

WebMatrix provided a quick way to get our Website up and running. And it provided the tools we needed to restrict access to data.

I’ll leave it as an exercise for the reader for the user signed in to retrieve only their page. But it has to do with:

@{
int userID = WebSecurity.CurrentUserId;

var SQLSELECT = "SELECT MyData FROM MyTable where UserID=@0"; /*UserID is a column in your table */
var db = Database.Open("YourDatabaseName");  
var mydata= db.QuerySingle(SQLSELECT, userID);
}


And in your HTML, your user will see only her data.

<p>My Data: @mydata</p> 

You can download WebMatrix from http://web.ms/webmatrix.

Bruce D. Kyle
ISV Architect Evangelist | Microsoft Corporation

cid:image010.png@01C9DEED.1FDB2200 cid:image011.png@01C9DEED.1FDB2200 cid:image012.gif@01C9DEED.1FDB2200 channel9