New to javascript, having trouble figuring this out, help!
I am trying to use the Javascript FileReader API to read files to upload to a server. So far, it works great for text files.
When I try to upload binary files, such as image/.doc, the files seem to be corrupted, and do not open.
Using dojo on the client side, and java on the server side, with dwr to handle remote method calls. Code :
Using a html file input, so a user can select multiple files to upload at once :
<input type="file" id="fileInput" multiple>
And the javascript code which reads the file content:
uploadFiles: function(eve) { var fileContent = null; for(var i = 0; i < this.filesToBeUploaded.length; i++){ var reader = new FileReader(); reader.onload = (function(fileToBeUploaded) { return function(e) { fileContent = e.target.result; // fileContent object contains the content of the read file }; })(this.filesToBeUploaded[i]); reader.readAsBinaryString(this.filesToBeUploaded[i]); } }
The fileContent object will be sent as a parameter to a java method, which will write the file.
public boolean uploadFile(String fileName, String fileContent) { try { File file = new File("/home/user/files/"+ fileName); FileOutputStream outputStream = new FileOutputStream(file); outputStream.write(fileContent.getBytes()); outputStream.close(); } catch (FileNotFoundException ex) { logger.error("Error uploading files: ", ex); return false; } catch (IOException ioe) { logger.error("Error uploading files: ", ioe); return false; } return true;}
I have read some answers suggesting the use of xhr and servlets to achieve this.
Is there a way to use FileReader, so that it can read files of any type (text, image, excel etc.) ?
I have tried using reader.readAsBinaryString()
and reader.readAsDataUrl()
(Decoded the base64 fileContent before writing to a file), but they did not seem to work.
PS : 1. Also tried reader.readAsArrayBuffer()
, the resultant ArrayBuffer
object shows some byteLength
, but no content, and when this is passed to the server, all I see is {}
.
- This bit of code is intended to work on only newer versions of browsers..