Uploading files with RAP 1.4

One of the new things in RAP 1.4 is the FileUpload widget in RWT, that replaces the old Upload widget from the sandbox. And there’s some more new upload stuff in the RAP Incubator. Here’s how to use the new features to upload files with RAP 1.4.

The FileUpload is a new widget that wraps the HTML file selection <input> tag. It looks like a button, and when it’s pressed, a native file dialog opens up that lets users select a file from their local file system. On file selection, a SelectionEvent will be fired. You can then programmatically upload the selected file to an http server using FileUpload.submit( URL ).

FileUpload Uploading files with RAP 1.4

In order to receive and store the uploaded files on the server, you also need a server-side component. We created such an upload server component in the RAP Incubator. It’s called FileUploadHandler and it uses the Apache fileupload component internally. It’s included in the bundle org.eclipse.rap.rwt.supplemental.fileupload. This handler accepts file uploads to a certain URL (FileUploadHandler.getUploadUrl()) and delegates the data to a FileUploadReceiver. You can either use the provided DiskFileUploadReceiver or create your own receiver to do whatever you like with the uploaded data: put it into a database, or simple analyze the data and discard it.

Sounds complicated? Well, there’s a much easier way to upload files with RAP 1.4! We’ve encapsulated the entire upload process in an implementation of the SWT FileDialog, which is also available in the incubator.

FileDialog1 Uploading files with RAP 1.4

To make it easy to use, we now provide an update site for the Incubator. To use the FileDialog in your application, all you have to do is to:

  1. include the bundles from the RAP Incubator repository http://download.eclipse.org/rt/rap/1.4/incubator/ in your RAP 1.4 target platform, and
  2. add a bundle dependency to org.eclipse.rap.rwt.supplemental.filedialog to your project (yes, you have to use Require-Bundle here because this bundle contributes a class to the org.eclipse.swt.widgets package, effectively creating a split-package).

That’s all. Now you can use the FileDialog just like in SWT:

  FileDialog fileDialog = new FileDialog( shell, SWT.TITLE | SWT.MULTI );
  fileDialog.setText( "Upload Files" );?
  fileDialog.setAutoUpload( true ); // This API will change, see below!
  fileDialog.open();
  String[] fileNames = fileDialog.getFileNames();

After uploading, the dialog closes and the variable fileNames contains the absolute file names of the uploaded files on the server’s file system. There’s an auto-upload feature that is really nice (I think it should be the default) – with autoUpload on, the upload starts immediately after file selection. A user can still press Cancel to prevent the application from using the uploaded files.

Note: Please note that this stuff is in the incubator and not part of the 1.4 release. The API and implementation may (and will) have to change and mature over time. However, if you use the latest version from 1.4/incubator site, you’ll always get a file dialog that will work with RAP 1.4. The server-side upload receiver and the required Apache bundles are also included.

We hope you enjoy these new features. Please try them out, tell us what you think, open bugs for the new stuff, and help us improving them.

Kudos to our new RAP committers Austin Riddle and Cole Markham who created this great new feature!

Update: I mistakenly left out the “.rwt.” from the bundle namespace in the original post, the bundle names are fixed now in the text.

Update: The 1.4 incubator repository has been updated with a newer version of the file dialog that is compatible with RAP 1.4. This update fixes the problem with missing file names mentioned in the comments.

47 Responses to “Uploading files with RAP 1.4”

  1. J.F.Kilian says:

    This feature is really cool and makes things much easier to use.
    The problem on my side is, that the default server-side receivers don’t keep the original filename extension. So the server has no chance to distinguish between a .pdf a .gif etc.
    It would be nice to have some hints about where to modify the default-receivers.

    Thanks,

    Jürgen

  2. Ralf Sternberg says:

    Thanks for the feedback, Jürgen.
    The default implementation DiskFileUploadReceiver does not keep the original filename, which is clearly a problem when using the FileDialog. But it seems that the current API of the FileUploadReceiver does not support passing this information to a receiver. I think we’ll have to add a parameter here to let the receiver make decisions based on the file name or type. Would you like to report this problem in our bugzilla? I think we can provide a solution soon.

    Best regards, Ralf

  3. Uli says:

    Hi Ralf,

    unfortunately the FileUpload widget does not provide the path information of the selected file. The method “getFileName” returns only the name of the file without the path. Is there a way to get the path of the file too?

    Thanks,
    Uli

  4. Ralf Sternberg says:

    Hi Uli,

    currently not – this is a known limitation, but we’re going to find a solution soon and update the p2 repository. I’ll post an update here when this issue is solved. See http://bugs.eclipse.org/350359

    Regards, Ralf

  5. Jessy says:

    Hi

    I have a problem to get it startet.

    1.include the bundles from the RAP Incubator repository http://download.eclipse.org/rt/rap/1.4/incubator/ in your RAP 1.4 target platform
    >no Problem, but
    2.add a bundle dependency to org.eclipse.rap.rwt.supplemental.filedialog to your project (yes, you have to use Require-Bundle here because this bundle contributes a class to the org.eclipse.swt.widgets package, effectively creating a split-package).
    is not working. When I start the RAP-Applikation the following exception is thrown
    org.osgi.framework.BundleException:
    Reason: Missing Constraint: Require-Bundle: org.eclipse.rap.rwt.supplemental.filedialog;

    I’m not so practised with Targed/Dependencies/Budels….so have anybody a solution for me?

    Thanks!

  6. Hi Jessy, this exception says that your launch configuration is missing a required bundle. Before starting, validate your launch configuration by clicking Validate Bundles on the Bundles tab.
    Regards, Ralf

  7. Erik says:

    Hi,

    got some problems while trying the RAP Demo which includes the new FileDialog.
    I’m using Helios and the latest release of RAP 1.4.
    As mentioned here I’ve also installed RAP Incubator files.

    After importing the psf for the RAP Demo the classes DialogUtil and DialogCallBack are not known.
    What is missing? I’ve already searched the web, but could not find any hints related to this.

    Thanks in advance and best regards,
    Erik

  8. Hi Erik,

    you are using the FileDialog from the current development stream which uses new 1.5 API. For RAP 1.4, you have to get the FileDialog from the v14_Maintenance branch or from the incubator repository mentioned above.

    Hope this helps, Ralf

  9. Erik says:

    Hi Ralf,

    Thanks for your reply.
    Does this mean the PSF for the Rap Demo already use 1.5 API?

    Regards,
    Erik

  10. Erik says:

    Hi Ralf,

    sorry if I got you wrong, but I already had the RAP 1.4 Target and the Incubators version of the FileDialog (1.4.0.201106201014).
    I switched the RAP Demo to the v14_Maintenance branch, but it does not contain the FileUpload dialog.

    Can you help me out?
    Erik

  11. Hi Erik, sorry, I was on the wrong track – the 1.4 incompatible code you referred to is in the example page which only exists in HEAD. All you have to do to use the code of the example page with 1.4 is to replace the non-blocking style:

    DialogUtil.open( fileDialog, new DialogCallback() {
    public void dialogClosed( int returnCode ) {
    showUploadResults( fileDialog );
    }
    } );

    with the blocking style:

    filedialog.open();
    showUploadResults( fileDialog );

    I’m sorry for the confusion.
    BTW, we’ll update the FileDialog repository with an improved version by ~ next week.

    Good luck, Ralf

  12. Erik says:

    works like a charm now :-)

    Thanks Ralf

  13. Ralf Sternberg says:

    The 1.4 incubator repository has been updated with a newer version of the file dialog that is compatible with RAP 1.4. This update fixes the problem with missing file names mentioned in the comments.

  14. Antoine says:

    Hi,

    I’ve tried the exemple but it seems that the new FileDialog component does not override the standard one. I’ve followed the steps referred in the example without success. I’m certanly wrong but where ?

    Regards,

    Antoine

  15. Ralf Sternberg says:

    Antoine, I’d like to help but don’t understand what you mean by “not override the standard one”. What is the standard component in your case?

  16. Antoine says:

    Sorry,

    I will try to explain clearer. I’m trying to use FileDialog class with specific implementation like showed above. My target platform is as follows :

    http://download.eclipse.org/rt/rap/1.4/incubator
    http://download.eclipse.org/rt/rap/latest-stable/runtime

    In “Dependencies/Required Plug-ins” I specified the following:
    org.eclipse.rap.rwt.supplemental.filedialog (1.4.0)
    org.eclipse.rap.rwt (1.4.0)

    It seems that Eclipse does not recognize specific methods and enhancements you made in FileDialog. For instance :
    fileDialog.setAutoUpload( true ) is not recognized as a valid method.

    My question is, how can I simple use FileDialog (and FileUpload) ? What do I miss ?

    Regards,

    Antoine

  17. Antoine says:

    I’ve created a new rap project from scratch and used org.eclipse.rap.rwt.supplemental.filedialog.demo source code and everything seems working now. Did not change anything neither in target nor in required plugins.

    Thanks anyway.

    Regards

  18. Ralf Sternberg says:

    Hi Antoine, good to hear that it works now. Just to clarify: the FileDialog is brand new in RAP. There has not been any implementation of the FileDialog in RAP before.
    Regards, Ralf

  19. Jeffry Santoso says:

    Hi, I’m try to download this fileupload at this http://download.eclipse.org/rt/rap/1.4/incubator/, but it said it is not found. When I try to go to the eclipse rap cvs (at cvsroot/rt/org.eclipse.rap/incubator/supplemental/fileupload/org.eclipse.rap.rwt.supplemental.fileupload & filedialog), I only find the 1.5 version, but do not find the 1.4. Where can I find the 1.4 version? I use eclipse Indigo.

    Because I am download from there in 1.5 version, the fileupload and filedialog get many errors. Or if the 1.4 version is not at there anymore, can I get the 1.4 version of fileupload and filedialog plugins? Many Thanks.

    Regards,
    Jeffry

  20. Ralf Sternberg says:

    Hi Jeffry, for the 1.4 version, you have to checkout the 14_Maintenance branch from CVS. The URL http://download.eclipse.org/rt/rap/1.4/incubator/ is a valid p2 repository, it’s not meant for downloading stuff with a web browser, but for including into a target platform. Ralf

  21. rocketman says:

    Ralf, thanks for the informative article! I’m having an issue running my simple hello world app to display the file dialog. I followed your 2 step instructions above and everything compiles fine, but the runtime error I get is:

    class “org.eclipse.swt.widgets.FileDialog”‘s signer information does not match signer information of other classes in the same package

    which I know means that there are classes in the same package in 2 different jars that have different digital signatures…I’m just not sure how to resolve the issue because filedialog.jar contains only FileDialog from org.eclipse.swt.widgets, but my app also requires other classes from that package, e.g. Shell. I’m new to RAP/RCP development, so I’m sure it’s something I’m missing.

    My source is this:

    public class EntryPoint implements IEntryPoint {

    public int createUI() {
    Display display = new Display();
    Shell shell = new Shell(display);
    shell.setLayout(new GridLayout(1, false));

    FileDialog fileDialog = new FileDialog(shell, SWT.TITLE | SWT.MULTI);
    fileDialog.setText(“Upload Files”);
    fileDialog.setAutoUpload(true); // This API will change, see below!
    fileDialog.open();
    String[] fileNames = fileDialog.getFileNames();

    shell.pack();
    shell.open();
    while (!shell.isDisposed()) {
    if (!display.readAndDispatch()) {
    display.sleep();
    }
    }
    display.dispose();
    return 0;
    }
    }

    I’m using Eclipse for RCP and RAP Developers, Indigo Release, Build id: 20110615-0604; and RAP 1.4.0.20110614-2335.

    Thanks in advance for your insights!

    Paul

  22. Jeffry Santoso says:

    Hi Ralf,

    Previously I try to adding them directly with CVS, not web browser off course. But I get 1.5 version (I think the procedure is same when getting org.eclipse.equinox.http.helper, org.eclipse.equinox.http.registry, etc). Later, I try to adding them into the target platform, and it works.

    Thanks

  23. Werner says:

    Hi Ralf,

    nice feature, I just replaced the old implementation with the new FileDialog and it works great.
    I only have one question concerning the usability: Why not throw away the + button, and add a new row automatically each time a file was selected? This would save a lot of clicks if you want to upload lots of files. Please let me know if you want me to file an enhancement request for this.

    Best, Werner

  24. Ralf Sternberg says:

    @rocketman, the latest version in the 1.4/inclubator repository is indeed unsigned. I’ll try to replace it by a signed version as soon as possible. Thanks for the pointer!

  25. Ralf Sternberg says:

    Hi Werner, I’m afraid that without a + button, the possibility to select multiple files would not be obvious in the first place. But I also realize that the current user interface is somehow not perfect. I’m sure it can be improved, maybe getting rid of the + button is part of the solution. It’s definitely worth to be discussed and your enhancement requests are welcome! Regards, Ralf

  26. rocketman says:

    Thanks, Ralf! I will try out the new version once it’s posted.

  27. Werner says:

    @Ralf: added enhancement request: https://bugs.eclipse.org/bugs/show_bug.cgi?id=356441

    I think it would become clear that multiple files can be uploaded when the 2nd UploadPanel appears.

    Regards, Werner

  28. Jeffry Santoso says:

    Hi Ralf,
    I have questions. 1. Can we validate the file first base on the file name before we upload? I see the file will be uploaded first then we have to validate after that. 2. Is there any function that get the original file name instead of we parse manual? The file example abc.jpg after we upload, the file will be abc.xxxxxx.jpg which the xxxxx is the temporary number.

    That’s only small functionality thing that I asked. Exclude of them, the plugins are very good. Thanks

  29. Ralf Sternberg says:

    @rocketman: I’ve replaced the latest version in the 1.4/incubator with a signed one. Can you please check again? Thanks, Ralf

  30. rocketman says:

    Ralf, the signed version worked for me! Thanks again!

  31. Ralf Sternberg says:

    Jeffry, this is not possible with the FileDialog API. But if you use the FileUpload widget itself, you can evaluate the original file name in a selection listener attached to the FileUpload. This listener will be called whenever a file is selected. Hope this helps, Ralf

  32. Jeffry Santoso says:

    Hi Ralf,
    I have successfully upload several files with no issue. But when I try to upload file with only 1 character of the filename (exclude extension), it is always fail. Try to rename your file become 1.jpg, 2.jpg, or a.jpg, etc. It is always failed. Is the error occurred in your computer too? Thanks

  33. Ivan Furnadjiev says:

    Hi Jeffry,
    we changed the implementation so the original file name is now preserved after the upload (the temporary numbers are in the directory name). Unfortunately, I can’t reproduce the issue with the single character name. Tested with FF 7, IE9, Chrome 14. What OS and browser are you using? If it is still reproducible with CVS HEAD, could you open a bugzilla with a snippet/example upload file to reproduce it. Thanks.

  34. Jeffry Santoso says:

    Hi Ivan, when I fetch the latest from CVS HEAD, I got a few error in filedialog package (FileDialog.java), in line 356 runEventLoop( shell );

    I’m still use RAP 1.4 not 1.5, and in filedialog package, I have successfully configured to run with 1.4, but still can’t solve the filedialog package (error above). Currently I use org.eclipse.rap.rwt.supplemental.filedialog_1.4.0.201108091246.jar and org.eclipse.rap.rwt.supplemental.filedialog_1.4.0.201108091246.jar.

    Btw, I have successfully compare those version (1.4.0.201108091246 and CVS head). When I try to compare and debug the app, I see the different in the implementation the file name in DiskFileUploadReceiver.createTargetFile. I try to add breakpoint, and yes, the error can be reproduced in my version (1.4). It got an Exception in FileUploadProcessor in line 66 (java.lang.IllegalArgumentException: Prefix string too short). I think it is because DiskFileUploadReceiver at line 60 when execute File.createTempFile

    So I change the old implementation the original file name (1.4) with the new one (CVS HEAD), and the problem is solved. Thanks

  35. Ralf Sternberg says:

    Hi Jeffry,

    if you can reproduce this error with the latest 1.4 version of the file dialog and even found a solution, it would be nice if you could open a bug and add your patch. For details, see http://eclipse.org/rap/bugs/

    Thanks, Ralf

  36. Jeffry Santoso says:

    Hi Ralf,
    Basically I’m just replace DiskFileUploadReceiver (in 1.4 version – org.eclipse.rap.rwt.supplemental.filedialog_1.4.0.201108091246.jar) with the CSV HEAD, and it is fixed. Should I still open a bug? Because the patch is already in the CSV head. Thanks

  37. Paul says:

    Hi Ralf,

    I can upload files using FileDialog when I’m running my application from Eclipse, but after creating a war file the application run from a web browser throws: HTTP Status 404 – ProxyServlet …The requested resource is not available.

    Have you faced this problem? I have included org.eclipse.rap.rwt.supplementa.filedialog in Plug-ins tab i feature.xml, but the application still does not work.

    I know that this problem is somehow related to the FileDialog, because after removing this widget and all entries in Required Bundles in the Manifest file, the deployed application works fine.

    Regards,
    Paul

  38. Ivan Furnadjiev says:

    Hi Paul,
    you need in your feature.xml also:
    org.eclipse.rap.rwt.supplemental.fileupload
    org.apache.commons.fileupload
    org.apache.commons.io
    Hope this helps,
    Ivan

  39. Ralf Sternberg says:

    Jeffry, if the problem exists with the latest version in the download.eclipse.org/rt/rap/1.4/incubator repository, then please file a bug for 1.4. Thanks and regards, Ralf

  40. Jeffry Santoso says:

    Hi Ralf, it is done. I have posted at https://bugs.eclipse.org/bugs/show_bug.cgi?id=360345. Hope I can contribute more later. Thanks and regards, Jeffry

  41. Avrajit says:

    Jeffry, This is an excellent feature developed. I want to know if you have this available in GIT or somewhere from where I can download the zip version (in form of jar say) of it as I am struggling to make a CVS connection and download the code. That will be a a great help !

  42. Paul says:

    Hi,

    Ivan, thanks for your help, somehow I managed to solve the problem.
    I have a question: how to filter files in the browser?
    There are methods avaliable, like setFilterNames and setFilterExtensions, and they
    seem to set the filter only in the main window (image at the top of the page), but
    the browser opened after clicking “Browse” does not filter the files (the filter list is empty).

    Thanks and regards,
    Paul

  43. Ivan Furnadjiev says:

    Paul,
    cross-browser filtering on the client is not possible. More over, the filter in the RCP file dialog (at least in Windows) is a convenience to the user, not a blocking feature. See this bug for more details and discussions on the topic:
    361001: FileDialog accepts filtered file name extension
    https://bugs.eclipse.org/bugs/show_bug.cgi?id=361001
    Best,
    Ivan

  44. Paul says:

    Ivan,

    Thank you for help.

    Regards,
    Paul

  45. Michael says:

    Hi,

    The FileUpload leaves temporary files in the “Local Settings\Temp” folder on the Server (WinXP) like upload_399f7116_1351ad7feda__8000_00000001.tmp.
    Is there a possibility to cleanup these files after uploading?

    Thanks
    Michael

  46. Austin Riddle says:

    Hi Michael,

    I recently upgraded FileUpload to use Apache Fileupload 1.2.2, so that we could use the FileCleanupTracker for proper cleanup. The new version in CVS HEAD will be set to cleanup after session termination, but will only actually do so after JVM garbage collection.

    Please see this bug for more information: https://bugs.eclipse.org/bugs/show_bug.cgi?id=362924

47 responses so far

Written by . Published in Categories: EclipseSource News, Planet Eclipse