Develop Reference

Get base64 content from local mp3/mp4

I'm trying to get the base64 content from a local audio on my device using javascript.
I'm using the following code:
var file = new File(["file_name.mp4"], "/data/user/files/VoiceRecordingPluginData/file_name.mp4");
var reader = new FileReader();
// Read file content on file loaded event
reader.onloadend = function (event) {
console.log(reader.result);
};
// Convert data to base64
reader.readAsDataURL(file);
As result, "file" gets populated like this:
file.name: ["file_name.mp4"]
file.localURL: "/data/user/files/VoiceRecordingPluginData/file_name.mp4"
Once "onloaded" is reached, "reader.result" is empty.
Any hints on what's wrong in my code?

Passing Uint8 array to PDF.js not working

I need to use PDF.js local, without a webserver. Just need to display a PDF which is in the same directory. Found this link here and also read in the FAQ that you can pass a Uint8 Array to PDF.js. I'm using filereader() to read the file. But I'm getting "Invalid PDF structure" error message. The PDF is ok - I've uploaded the whole thing to a webserver for testing. When opening the PDF with viewer.html online its working. What am I missing?
This is my code so far:
var file = new File(["compressed.tracemonkey-pldi-09.pdf"], "compressed.tracemonkey-pldi-09.pdf", {type: 'application/pdf'});
var fileReader = new FileReader();
fileReader.onload = function() {
var typedarray = new Uint8Array(fileReader.result);
pdfjsLib.getDocument(typedarray).then(function(pdf) {
//do something
});
};
fileReader.readAsArrayBuffer(file);

HTML5 file upload script not loading file

Newbie to the HTML5 file upload capability, and finding I cant get a simple xml file uploaded and able to get file contents into console. The expected behaviour is that I'd select an xml file and then see the contents rendered in console. However, I dont ever get to the console.log step - seems the reader never loads? Any suggestions to resolve would be most appreciated.
<input type="file"></input>
<script>
var upload = document.getElementsByTagName('input')[0];
upload.onchange = function (e) {
e.preventDefault();
var file = upload.files[0], reader = new FileReader();
reader.onload = function (event) {
console.log('evt',reader.readAsText(file));
};
return false;
};
</script>

So you're setting the reader.onload event to a function, but you need to call the reader.readAsText() function outside of this.
So for example change your code to:
reader.onload = function(event) {
console.log(event);
};
reader.readAsText(file);
What this does is to tell the reader that when you call reader.readAsText(file) it should run the function you defined with reader.onload.
What you were doing before would never load the file because you were only telling the reader to readAsText inside your function callback that you told it to run when it was already loaded!

How do i remove files from a zip file uploaded through kendoUpload? Using jszip

After the user uploads a zipped file, i want to remove the images folder from it before sending it over the network. I am using kendo for uploading, and the existing functionality works fine. I just want to add on the removing images part. This is what i have so far:
function onSelect(e) {
var file = e.files[0];
if (endsWith(file.name, '.eds')) {
var contents = e.target.result;
var jszip = new JSZip(contents);
jszip.remove("apldbio/sds/images_barcode");
fileToSend = jszip.generate({type: "base64", compression: "DEFLATE"});
}
e.files[0] = fileToSend;
openProgressDialog(e.files.length); //this is existing code, works fine
}
target.result doesn't seem to exist in the event e. And nothing works properly from that point on. e should probably be used inside a FileReader object's onload(), (as seen here and here) but i have no idea how to use a FileReader for my purpose, with kendo Upload.
EDIT:I did some more reading and now i am using FileReader like this:
var reader = new FileReader();
reader.onload = function (e) {
// do the jszip stuff here with e.target.result
};
reader.onerror = function (e) {
console.error(e);
};
reader.readAsArrayBuffer(file);
Note : file = e.files[0] as in the 1st code block.
With this though, i get the error:
Failed to execute 'readAsArrayBuffer' on 'FileReader': parameter 1 is not of type 'Blob'.

Meteor: upload image file using FileReader on client and Npm.require("fs") on server

I'm having some trouble trying to upload an image file to my public/ folder using a standard <input type="file"> element.
So i have this event:
"change .logoBusinessBig-upload":function(event, template){
var reader = new FileReader()
reader.addEventListener("load", function(){
Meteor.call("saveFile", reader.result)
})
reader.readAsArrayBuffer(event.currentTarget.files[0])
}
When i do a console.log(reader.result) inside the eventListeners callback, i get an ArrayBuffer object.
In my server/server.js file i have this Meteor.method:
saveFile:function(file){
var fs = Npm.require("fs")
fs.writeFile('message.jpg', file, function (err) {
console.log("file saved")
});
}
However, the file doesn't get saved and the console never says "file saved". What am i doing wrong here?

Try this
//client.js
'change .logoBusinessBig-upload': function(event, template) {
var file = event.target.files[0]; //assuming you have only 1 file
if (!file) return;
var reader = new FileReader(); //create a reader according to HTML5 File API
reader.onload = function(event){
var buffer = new Uint8Array(reader.result) // convert to binary
Meteor.call('saveFile',buffer);
}
reader.readAsArrayBuffer(file); //read the file as arraybuffer
}
//server.js
'saveFile': function(buffer){
var fs = Npm.require("fs");
fs.writeFile('/location',new Buffer(buffer),function(error){...});
}
Explanation
You read the file as ArrayBuffer, but current DDP can't send it, so you 'convert' it to Uint8Array, then Meteor.call
On the server, then you have to convert it by calling new Buffer(buffer) to save it. The '/location' can't be in meteor folder as this will trigger a reload, maybe save it to some TmpDir

I think 'fs' is a native nodejs's module. Simply try to requiring it this way: var fs = require('fs')