2010-05-23

Fixing File upload session issue with non IE browsers

I did a lot of learning this passed week about security and how to protect web applications written in HTML and Flex against various attacks. I would like to prepare an entire lecture on the subject but I thought I'd share one particular topic on my blog for now.

The topic I want to talk about is securing file uploads to a server via Flex. If you have added file upload functionality to a Flex application you have probably run into the issue of session information being lost during the upload. And this makes server-side security validation a big issue.

Note: This problem description and solution is using Java application server running BlazeDS or LCDS.

The problem

The problem occurs whenever you perform a file upload using Flex. I'm not going to write all the lines of code here, but basically the following lines of code will do the trick:

var req:URLRequest = new URLRequest();
req.method = URLRequestMethod.POST;
req.data = someData;

var fileReference:FileReference = new FileReference();
fileReference.upload( req, "/phoenix/FileServlet" );

Those lines of code will upload whatever file the user selected to the FileServlet servlet under the phoenix context. Under non-IE browsers this operation will occur in a different browser thread thus causing a different session to be created on the server-side. Thus the application session and upload session are different and are not sharing information. This is basically the root cause of the problem. This means that if you wanted to retrieve the login name of the user currently authenticated, you will get no value. So the following line of code will return NULL:

request.getRemoteUser();

Also if you try to validate that the user has the appropriate role using the standard request.isUserInRole( "UPLOAD_ROLE" ); method call, it will always return FALSE. Needless to say this is a critical issue from a security perspective as you need to know who is doing the file upload and if he is allowed to perform the operation. Without this information basically anybody can perform a file upload request and in some cases with malicious intent.

The solution

Since a new session is being created for the file upload operation, we need to tell the server to associate this session with our existing authentication session. We accomplish this in two parts, first by giving Flex our server session ID and then sending it back during the file upload. Here are the details of these two operations.

Sending back the server-session ID

Right after the Flex application initializes, call the remote server method to retrieve the server-session ID. In Java the remote method will look like this:

public String getSessionInfo()
{
return FlexContext.getFlexSession().getId();
}

Sending the session ID during the upload operation

Now that you have the session ID, you need to send it back with the call to the FileServlet along with the session cookie name. So from our sample above, the following line:

fileReference.upload( req, "/phoenix/FileServlet" );

Should be changed to:

fileReference.upload( req, "/phoenix/FileServlet;cookieName=" + sessionID );

Note: The variable cookieName needs to be the actual session cookie name you have configured for your Java web application (ex.: myappcookie).

So now, when the file upload operation occurs it will send back the session ID along with the file and so the server will associated that with your existing authenticated session. Now you can retrieve the login name of the currently authenticated user and validate that the user has the appropriate roles (see sample code above).

2010-05-18

Flexcommon 1.2 released

I have just uploaded the latest version (1.2) of my FlexCommon library to its home on GoogleCode. This latest release contains the following changes:
  • Compiled with Flex 3.2
I dont see this as a problem and should allow a wider audience to use the library.
  • DataComboBox
This is an extension of the ComboxBox control. Lots of times we set the dataProvider and then want to set the selectedIndex based on some value withing the dataProvider. For this purpose I have created the DataComboBox control, which has two new properties: dataField and dataValue. The dataField property tells the control which property within each item of the dataProvider to examine and the dataValue property is the value to compare against. Once a match is found. the selectedIndex is set. See the documentation for an example.
  • New StringUtils.isNumeric() method
New convenience method to determine if a string contains only numeric digits.
  • Comes with en_US and fr_CA language bundles
All the error messages returned by validators are now contained with resource bundles: en_US (English) - the default - and fr_CA (French). You can of course create your own and if you wish to submit it to me I will include it!

2010-05-11

Fixing the "unable to export SWC oem" error in Flash Builder

If you created a project using Flex Builder 3 and wish to upgrade it to Flash Builder 4, you might see the following error in the Eclipse "Problems" view when you attempt to compile for the first time:

unable to export SWC oem.

I read on several sites how to fix the problem but here is my little piece of details with step-by-step instructions:

  1. Shutdown eclipse
  2. Using your favorite text editor, open the .flexLibProperties file in the root of your project
  3. Erase all lines between the <includeResources> tags and just replace with an empty version of that tag (e.x.: <includeResources/>)
  4. Save updated .flexLibProperties file
  5. Start eclipse
  6. Use the clean and build options under the "Project" menu
And voila, your project now compiles under Flash Builder 4

Enjoy!

2010-05-02

Open Source Week in Montreal (MonDev)

For those interested, "Open Source Week' is happening this month in Montreal from May 24th to the 28th, also known as MonDev. Go to the site to see what topics and being presented and to register as a speaker if that interests you.

2010-04-27

Copy operation between List / DataGrid

One of the great things about Flex is how much is available out-of-box. One feature that is provided out-of-box is the ability to easily drag'n'drag data from one control to another. One great example of this is to drag'n'drop data from a source List control to a destination List control and vice-versa. A example use case is where you are allowing the user to assign "users" to a "group" from an available list of "users".

This is code to implement this functionality is as follows:

[List id="availUsers" dragEnabled="true" dragMoveEnabled="true" dropEnabled="true" dataProvider="{availbleUsers}"]

[List id="assignUsers" dragEnabled="true" dragMoveEnabled="true" dropEnabled="true" dataProvider="{assignedUsers}"]

Pretty simple eh? Basically what this code is saying is that both List controls are drag sources (dragEnabled="true"), that both are drop destinations (dropEnabled="true") and that when data is dragged from the control, that the data should be removed (dragMoveEnabled="true") - since it will be moved to the destination.

In some cases, as it happened to me just yesterday, you don't want the data to go back and forth between the two controls. In my case, I need the available list of users to remain as-is and that you could assign a user multiple times to the destination list.

To accomplish this, you just need to make the following changes:

[List id="availUsers" dragEnabled="true" dragMoveEnabled="false" dropEnabled="false" dataProvider="{availbleUsers}"]

[List id="assignUsers" dragEnabled="false" dragMoveEnabled="true" dropEnabled="true" dataProvider="{assignedUsers}"]

With the changes, this will allow data to be copied from the available users list (dragMoveEnabled="false") to the assigned users and you can't go back (dragEnabled="false").

2010-04-07

Flash Player 10.1 pre-release

Adobe has setup a page that allows you to download a pre-release version of the next version of the Flash Player. That's version 10.1, which is heavily geared for running on mobile devices; but the desktop version gets all the advantages as well.

You can view some demos on the page showing the Flash Player 10.1 running on various devices and at the bottom of the page there are some quick interviews with Adobe employees; each one talking about one of the new changes that are present in the upcoming release.

2010-04-03

Handling change - the YouTube way

Just noticed today that YouTube changed their site a little bit - more like tweaked. No big deal really, they have added some video controls and changed others. What I do like is that at the top-right corner of the page, their is a little blue information box that allows you to "take a tour of the changes". And like it says, it uses a little JavaScript overlay to take you on a tour of the page you are looking and explains the various parts of the page that have changed and how it now works. Simple and ingenious.

Some people hate changes, even of the smallest kind (Napoleon would be outraged! - internal friendly joke). This is a good way I think of showing users that the changes are no big deal really and you can continue on using YouTube to enjoy your favorite videos as you always have and with a smile :)