How to retrieve file from GWT FileUpload component?

Question

I want to upload a file using GWT fileUploader component,

I tried like this,

FileUpload fileUpload = new FileUpload();
filepload.addChangeHandler(ne         


        

Answer 1

I am guessing you want to allow user to upload file using GWT Fileupload widget and then do not wish to process it on server side. You want a byte array representation in client side.

Usual steps for File Processing Browser -> File Upload Dialog -> Select File -> Submit Form with File to server -> Process File on Server -> Send back processed file to Client as response ( string ).

If you want to avoid the above steps and process the file in browser there is no way to do it in current javascript. Parallel technologies like Flash, Applet, Silverlight or Activex might help. The correct approach to be pursued in future would be using HTML5 file apis.

If you do not wish to use legacy technology like flash/applet then HTML5 apis on FileReader can be explored. However tradeoff is you need to check whether api is supported across browser.

HTML5 FileReader

FileReader includes four options for reading a file, asynchronously:

FileReader.readAsBinaryString(Blob|File) - The result property will contain the file/blob's data as a binary string.
FileReader.readAsText(Blob|File, opt_encoding) - The result property will contain the file/blob's data as a text string. 
FileReader.readAsDataURL(Blob|File) - The result property will contain the file/blob's data encoded as a data URL.
FileReader.readAsArrayBuffer(Blob|File) - The result property will contain the file/blob's data as an ArrayBuffer object.

Example of GWT wrapper over these - https://github.com/bradrydzewski/gwt-filesystem

Reference -

• http://www.html5rocks.com/en/tutorials/file/dndfiles/
• HTML5 File API read as text and binary