How do I make Flex file upload work on firefox and safari?

Question

I have a flex app that uploads files to a server. The server requires authentication to be able to upload. In IE the upload works fine. However in FF and Safari, it does not upload. I have seen people all over with this same problem but no answers. Don't fail me now stackoverflowers.

Answer 1

I found this question while trying to find the answer myself. The solution was rather simple.

Based on the flash player bug that others have linked, and the comments on that page, I decided to append session identifiers to my upload URL and give it a shot. It really was that easy!

To make it work, I started by adding a flashVar parameter called sessionParams. This allowed me to pass any string I want in to the flash player as my session identifier, and it will later get appended to the URL used to upload.

//sessionParams - resolves firefox upload bug
public var sessionParams:String = "";

//...

public function initApp():void{
    sessionParams = Application.application.parameters.sessionParams;
}

In my case, I'm on ColdFusion with java sessions enabled, so my sessionParams are setup like the following before being passed into the flash player:

<cfset flashVars = "sessionParams=#urlEncodedFormat('jsessionid=' & session.sessionid)#" />

Don't forget to escape special characters like =,&, etc (which I've done with urlEncodedFormat), so that they are treated as part of the value of the "sessionParams" parameter, and not breakpoints to indicate other parameters. You're embedding future-URL information in the current URL.

Then, use the sessionParams value in your upload code. Here's a snippet of how I set mine up:

// Set Up URLRequest
_uploadURL = new URLRequest;
_uploadURL.url = _url + "?" + _sessionParams;
_uploadURL.method = "GET";
_uploadURL.data = _variables;
_uploadURL.contentType = "multipart/form-data";

The variable names are different (but similar) because this is part of a reusable class.

Hopefully that helps you. If not, let me know and I'll try to provide more code or explanation to help you out.

Answer 2

The problem at least in Firefox is that the session cookies are not sent in the request when you invoke FileReference.upload(). What you need to do is add the authentication token either as a form variable or in the query string. Here is an example in Java where the session cookie is called "jsessionid"

var request : URLRequset = new URLRequest( uploadUrl + ";jsessionid=" + jsessionid);

You can parse the jsessionid out of cookies using Javascript and ExternalInterface to invoke the Javascript function. Or after you authenticate you can have Flex call a backend method that returns the current sessionID.

The related Flex bug is here:

http://bugs.adobe.com/jira/browse/FP-201

Answer 3

I solved this problem. File upload using flex will work on all the browsers.In J2ee application,

comment the security-constraint or make the fileupload.do URL unprotected in web.xml where you will put the actual code.

<security-constraint>
    <display-name>Senusion Security Constraint</display-name>
    <web-resource-collection>
        <web-resource-name>Un Protected Area</web-resource-name>
          <url-pattern>/fileupload.do</url-pattern>
      </web-resource-collection>
</security-constraint> 

Hope this will help the next reader.

Answer 4

FlashPlayer 10 provides a new Filereference API that can help a lot. Here is a blog entry that describes it : http://www.flexpasta.com/index.php/2010/02/21/uploading-files-with-firefox-solution/.

Indeed in Flash 10 an enhancement to flash.net.FileReference makes it possible to read the contents of a file before it is uploaded. Meaning that the file can be uploaded in different ways then can be done in Flash 9. The following example shows how easy file uploading can be and is not tied to SSL, Firefox, IE, Chrome, etc.