I've been deep fried!

Keith Elder and Chris Woodruff were nice enough to have me on their excellent and very popular webcast Deep Fried Bites last month, and the episode is up and ready! We discuss the security environment for web developers today, focused on the OWASP Top 10 and testing your web app.

I had a good time on the show, and it turned out really well, I think. Hope you'll take a listen!

http://deepfriedbytes.com/podcast/episode-83-helping-web-developers-get-more-secure-with-bill-sempf/ 

Windows 8 CP installation experience

Some of you may have read my dual boot setup post when Dev Preview (DP) came out. Now it is time to upgrade that rig to Consumer Preview (CP), and I through I would give an update.

The bootable USB drive I used for DP got repurposed for CP, so the laptop got booted from that. I decided to format the partition that I had used to set up dev preview, and do a fresh install of Consumer Preview. The disk tools look unchanged (since Vista, actually) and that went painlessly. So far so good.

Interesting that the license key management has been installed, anthough it is freely avainatable. The English key is DNJXJ-7XBW8-2378T-X22TX-BKG7J. Other than that the installation was the same as DP. The install took about 6 minutes on my Intel i7.

If you are using a bootable USB note that Windows won't warn you before reboot. It will go right back into the setup routine when it is finished installing. You can just turn the machine off, unplug the USB drive, and turn the machine back on to continue installation.

The best news was that is honored my dual boot that DP set up!

 I was happy about that. There are backups, and honestly I pretty much live in Windows 8 now, but it is nice to know my Windows 7 partition is still there if I need it.

It should be noted that my display driver wasn't recognized. I downloaded the NVidia display driver from Acer's site and installed it. After a reboot, I was in business - awesomesauce.

Oh, and another thing: I installed Windows 8 CP on my Asus slate Wednesday with zero problems also. It isn't a dual boot though so I didn't think it was worth a blog post. This one is a little neater.

Hope everyone is enjoying Windows 8! Now go build some apps!!

How to login to Facebook from Windows 8 Metro using HTML 5

Facebook login with OAuth 2.0 is baked into WinRT. You can't actually use the samples on the Facebook Developer postal. So, from an application, try these steps:

  • Start with a Navigation template, or add an appbar to your app
  • Add a login button to your appbar. Should be in the default.html page in the root directory
<button id="loginButton" class="win-command" style="float: right;">
  <span class="win-commandicon win-large login"></span><span class="win-label">login</span>
</button>
  • In the related JS file, add an event handler for the button. This collects the required values for the OAuth call and then calls Windows.Security.Authentication.Web.WebAuthenticationBroker.authenticateAsync, where all the magic happens. The scope parameter in the querystring is how you get extended permissions.
function loginButtonClick() {
        var facebookURL = "https://www.facebook.com/dialog/oauth?client_id=";
        var callbackURL = "https://www.facebook.com/connect/login_success.html";
        var clientID = "12434567890987654321";
        facebookURL += clientID + "&scope=publish_stream,publish_checkins,publish_actions,share_item&redirect_uri=" + encodeURIComponent(callbackURL) + "&scope=read_stream&display=popup&response_type=token";

        var startURI = new Windows.Foundation.Uri(facebookURL);
        var endURI = new Windows.Foundation.Uri(callbackURL);

        try {

            Windows.Security.Authentication.Web.WebAuthenticationBroker.authenticateAsync(
								Windows.Security.Authentication.Web.WebAuthenticationOptions.default,
								startURI,
								endURI).then(callbackFacebookWebAuth, callbackFacebookWebAuthError);
        } catch (err) {
            console.log(err.message);
            return;
        }
    }
  • The promise has callbacks for completion and error. You can swallow the error, but on completion, make sure to keep the token.
function callbackFacebookWebAuth(result) {
        var url = result.responseData;
        var querystring = {};

        url.replace(
            new RegExp("([^?=&]+)(=([^&]*))?", "g"),
            function ($0, $1, $2, $3) {
            querystring[$1] = $3; }
        );
        facebookToken = querystring["access_token"];

    }
 
And that's about it. The token in facebookToken is what is used to call the open graph. For instance, to get my data, I could call the graph like this: 
 
facebookButton.addEventListener('click', function () {
	var buildUrl = "https://graph.facebook.com/billsempf/feed?access_token=" + PA.facebookToken;
	WinJS.xhr({ type: "GET", url: buildUrl }).then(parseProfileJson, promiseError);
    });

Win8 Metro Style navigation

WARNING! This is based on Developer Preview, and much has changed.

Navigation in Metro is a little fuzzy right now. Fortunately Visual Studio has a navigation template. If you click File.NewProject, and dig into the Metro JavaScript apps, then you will see the Navigation Application. It is described as a “minimal style application that uses Windows Metro style frameworks and includes navigational support.”

The Navigation Template

A look at the source that the Navigation template shows us a pretty contemporary divided-screen model.  It has div that will contain the content, and another one that has the navigation tools.

<body data-homePage="/html/homePage.html">
    <div id="contentHost"></div>
    <div id="appbar" data-win-control="WinJS.UI.AppBar" aria-label="Command Bar" data-win-options="{position:'bottom', transient:true, autoHide:0, lightDismiss:false}">
        <div class="win-left">
            <button id="home" class="win-command">
                <span class="win-commandicon win-large">xE10F;</span><span class="win-label">Home</span>
            </button>
        </div>
    </div>
</body>

The div labeled contentHost will be used to store the content that is directed there. The appbar div is of some more interest. It has a data-win-control property, which is a Metro-specific field that includes specific styles and functionality at render time.

This one is the WinJS.UI.AppBar, which is the little sliding bar that you can access in a Mero app by sweeping from the bottom. There is a 1 pixel trigger left in the bottom of all application that makes the sweep work, and the div shown here sets up the content for the bar.

Right now there is just one button in the bar. If you just click the Debug button without making any changes, you get one button that goes to one page that you already start at. Not terribly interesting.

What that AppBar is supposed to do it give you the ability to load new fragments into contentHost. You can do this with direct buttons, page numbers, or VCR style controls. Doesn’t matter, as long as the content gets loaded.

Loading the fragments is set up in default.js. Remember that weird data-homepage attribute in the body tag of the default page? Well, that’s used to set the initial page in contentHost.

WinJS.Application.onmainwindowactivated = function (e) {
        if (e.detail.kind === Windows.ApplicationModel.Activation.ActivationKind.launch) {
            homePage = document.body.getAttribute('data-homePage');

            document.body.addEventListener('keyup', function (e) {
                if (e.altKey) {
                    if (e.keyCode === WinJS.Utilities.Key.leftArrow) {
                        WinJS.Navigation.back();
                    }
                    else if (e.keyCode === WinJS.Utilities.Key.rightArrow) {
                        WinJS.Navigation.forward();
                    }
                }
            }, false);

            WinJS.UI.process(document.getElementById('appbar'))
                .then(function () {
                    document.getElementById('home').addEventListener('click', navigateHome, false);
                });

            WinJS.Navigation.navigate(homePage);
        }
    }

After activating the app, a few keyboard events are handled, and then the WinJS.Navigation namespace is used to navigate the page to homepage.

Adding a fragment

One page is really quite boring – why would you need navigation for one piece of content, right? To make things a little more interesting let’s do something wild, like add a page, screen form, wqhatever you want to call it. From Microsoft’s perspective, it is a ‘fragment’ and it is treated like a form or page in any other paradigm.

To add a ‘page 2’ to the template application:

1) In the Solution Explorer, right click on the HTML folder and click Add | New Item…

2) In the Add New Item dialog select the HTML Fragment item and name is Page2.html.

3) After you have added the new fragment, all of the fragment files will be in the HTML folder, as of this writing. Move them into their correct folder. The CSS file goes in the CSS folder and the JS file goes in the JS folder.

4) Update the references in the Page2.html file to point to the new file locations.

<link rel="stylesheet" href="/css/Page2.css" />

<script type="ms-deferred/javascript" src="/js/Page2.js"></script>

5) Update the body content of Page2.html so that we can show some cool neato content when we get there.

<body>
    <div class="Page2 fragment">
        <header role="banner" aria-label="Header content">
            <button disabled class="win-backbutton" aria-label="Back"></button>
            <div class="titleArea">
                <h1 class="pageTitle win-title">Welcome to Page2</h1>
            </div>
        </header>
        <section role="main" aria-label="Main content">
            <p>This is my new page 2! Isn’t it cool?</</p>
        </section>
    </div>
</body>

6) In default.html, add a button that will take the user to page 2. This goes in the appbar div.

<div id="appbar" data-win-control="WinJS.UI.AppBar" aria-label="Command Bar" data-win-options="{position:'bottom', transient:true, autoHide:0, lightDismiss:false}">
    <div class="win-left">
        <button id="home" class="win-command">
            <span class="win-commandicon win-large">xE10F;</span><span class="win-label">Home</span>
        </button>
        <button id="page2" class="win-command">
            <span class="win-commandicon win-large">xE10F;</span><span class="win-label">Page2</span>
        </button>
    </div>
</div>

7) In default.js, you will need an event handler for the new button.   Add it to the process method for the appbar (it’s near the end).

WinJS.UI.process(document.getElementById('appbar'))
    .then(function () {
        document.getElementById('home').addEventListener('click', navigateHome, false);
        document.getElementById('page2').addEventListener('click', navigatePage2, false);
        });
WinJS.Navigation.navigate(homePage);

8) Hey, we need a navigatePage2 method, don’t we? Let’s add that above the process code.

function navigatePage2() {
    WinJS.Navigation.navigate("html/page2.html");
    WinJS.UI.getControl(document.getElementById('appbar')).hide();
}

That should be everything we need. Press F5 to run and (if you are on a regular machine) press Windows+Z to bring up the new appbar. Tap that neat new Page 2 button. And of course here is more to it than this. You might need to keep an array of pages in memory and provide a next/back button, or give random access via a menu. The principles are the same though. Good luck!

Direct Object References

I have to use the Open Graph API from Facebook ton my current project, and I found a real life example of the Direct Object Reference flaw I discuss in my Pentesting ASP.NET talk.

The Direct Object Reference is one of the OWASP Top 10, and is one of the most common security flaws in REST or SOAP APIs. When you use a knowable value as a unique identifier in your response, you are exposing an inportant part of your architecture to a potential attacker, or anyone else who deems your information interesting.

I was suprised to discover that the user identifier for Facebook is an integer. The OpenGraph request for a user looks like this:

https://graph.facebook.com/1138975844

That's me, obviously.

 

{
   "id": "1138975844",
   "name": "Bill Sempf",
   "first_name": "Bill",
   "last_name": "Sempf",
   "username": "billsempf",
   "gender": "male",
   "locale": "en_US"
}

 

By the way, I have every privacy control turned on, and yet anyone can view this basic information. I'm not terribly happy about that.

But who is next in line?

https://graph.facebook.com/1138975845

That could get interesting.

{
   "id": "1138975845",
   "name": "Mary Loaiza",
   "first_name": "Mary",
   "last_name": "Loaiza",
   "link": "http://www.facebook.com/people/Mary-Loaiza/1138975845",
   "gender": "female",
   "locale": "es_LA"
}

Huh.

I wonder how Mary feels about me knowing that she is a facebook user.

Anyway, that's a direct object reference. Keep an eye out for it in your code. It's very simple for an attacker to write a script that checks every number in a range, and get a lot of your database. The easy remiadiation is to use a GUID as the ID, or use the ESAPI AccessRequestMap

 

 

 

 

 

 

Testing for my CSSLP and trying uCertify.

As part of my stated goal to become more active in the Information Security market (following my career path of Integration-Performance-Security), I have decided to certify as a CSSLP. There is a wealth of knowledge out there about the SSDLC part of things that I don't really hold, and it is time.

By way of Coincidence, uCertify emailed me just the other day and offered me the opportunity  to try out one of their prep kits. Needless to say I selected the Certified Secure Software Lifecycle Professional kit.  So I am going to get to review the kit in the best way possible - actually taking the exam!

The initial look of the kit is very nice - it is an installed package rather than a web based thing, which gives some nice user interface features but makes it a little less accessible. The learning mode is tightly integrated with the practice tests, which will help me a lot. I already know about 70% of what is on the test, so I need something that will help me focus on the 30% and uCertify seems to be doing that.

Plan on hearing a little more from me in the next month about this - I plan to test around the end of February. Wish me luck!

Referencing a C# class library in HTML5 Metro UI

I am sure that you, like me, are hoping that you can use your C# code as the backend to your HTML5 Metro applications. For instance, I need to use the Meetup API that I am developing in a metro application that I am planning. I don't want to rewrite all of that in JavaScript.

In the solution that needs the C# class, right click on the solution in Solution Explorer and select Add New Project. I used new rather than trying to import one becasue the import facility is a little buggy in Visual Studio 2011. Click on Visual C# and then select Class Library as shown in Figure 1.

 

Figure 1- Add a class library

Once the project is added , you need to make two changed before you can reference it in your HTML5 application. First, the output type of the assembly needs to be set to WinMD File, as shown in Figure 2.  You can change this in the Properties.

 

Second, you need to seal the class. You can do that in the code for the class, using the sealed declaration, like this:

    public sealed class WebService
    {
        public string BaseUri { get; set; }

    }

Note that implementation inheritance isn't alloweed in Metro applications, so you need to head back to the 90s to get your polymorphism working, sorry!

 

MetroUI:Another user has already installed an unpackaged version of this application.

If you have had to delete your user profile in Windows 8 to get around the known Internet Explorer 10 bug, you might have run into this error when trying to run an app from Visual Studio

Error    2    Another user has already installed an unpackaged version of this application.                    The current user cannot replace this with a packaged version.                    The conflicting package is 00392a51-cf7d-4fd5-bde7-be48dcef9ec2 and it was published by CN=sempf     ToDoTodayApp

The reason this happens is the Package Name parameter of Metro apps.  In the Package.appxmanifest you can see the GIUD that is used for the unique app identity.

<Package xmlns="http://schemas.microsoft.com/appx/2010/manifest">
  <Identity Name="00392a51-cf7d-4fd5-bde7-be48dcef9ec2" Version="1.0.0.0" Publisher="CN=sempf" />
  <Properties>
    <DisplayName>ToDoTodayApp</DisplayName>
    <Description>ToDoTodayApp</Description>
    <PublisherDisplayName>sempf</PublisherDisplayName>
    <Logo>images\storelogo.png</Logo>
  </Properties>

All I had to do to get around the problem was alter the GUID, and the program ran fine.

On popular events and the efficacy of registrations

Codemash - probably the single best regional development conference in the country - sold out of 1200 tickets in 20 minutes.  This is pretty impressive, but hardly unheard of.  ShmooCon, the DC security conference, sells out in a few seconds every year. and has gone to a lottery system to distribute tickets. This is not optimal because many who want to go and should go are not admitted by pure bad luck, making the conference worse overall.  While degradation in quality is an effective way to reduce queue length, it isn't one that anyone really wants.

I am fascinated with the economics and psychology behind popular events and their queues.  Generally, for something like a concert, you will drive the queue length down with cost.  You want to see Madonna?  Fine - $350. Too rich for your blood? Good - we had too many people anyway.  This works for a lot of entertainment topics, actually, since there is no moral standard for admittance.

Colleges are another story.  A good college will have an abundance of admissions, but only a few will be accepted.  Private schools will filter with cost as well - but is this a good idea?  Do you want those with the most money, or those who have the best chance for success? Those two items won't always overlap.  The Objectivist seminar that used to be in Virginia every year had a good solution: they filtered with high cost but had a scholarship program.  To apply for a scholarship, you needed to do a LOT of writing, and it had to be GOOD.  Few went to the trouble, but those who did REALLY wanted to be there. I know, because I was a recipient in 1997.

But how to reduce the queue for something like Codemash? Eventually something like a lottery will have to be instituted, because next year noone trying to register more than a few people at a time will be able to get tickets. But see, that is a problem, as this is a conference where people who really WANT to be there, should be there.  High prices have a similar problem - in general the community is not short on funds so that will probably do nothing except tick people off. (Although a charity could get involved which would be neat).  Even then, do we really want to put the con out of the reach of students? Early registration - effectively reserving space WAY in advance - is another possible solution. I am sure there are other options - guess I need to get out the queuing textbook from OSU.

They aren't kidding about that 'enable exceptions' thing

In the default templates for WinJS Windows 8 applications, there are two lines that are easy to ignore:

 

    // Uncomment the following line to enable first chance exceptions.
    // Debug.enableFirstChanceException(true);

 

They aren't kidding.  I was doing a little work with the Pastebin API (shh, don't tell anyone) and had failed to declare a variable.

Over and over, I would run it and have no idea that something was wrong.  I would have to set a breakpoint and know where to look to find errors.  It sucked.  I am too used to an IDE.

Then I remembered those lines, uncommented the Debug member there, and was good to go.  It seems painfully obvious now, but it didn't before and if I can help someone else not pull their hair out, we are all the better.

Generally, though, I am not sure how I feel about this.  It seems a lot like On Error Resume Next in VBscript, and we all know how THAT turned out.

Bill Sempf

Husband. Father. Pentester. Secure software composer. Brewer. Lockpicker. Ninja. Insurrectionist. Lumberjack. All words that have been used to describe me recently. I help people write more secure software.

PageList

profile for Bill Sempf on Stack Exchange, a network of free, community-driven Q&A sites

MonthList