I am trying to download a file I uploaded as test to Dropbox. The download function works and I am getting the fileblob as well but having trouble to actually read the file contents
function downloadFile() {
dbx.filesDownload({path: '/_bk_test/test3.json'})
.then(function(response) {
var blob = response.fileBlob;
var reader = new FileReader();
reader.addEventListener("loadend", function() {
console.log(reader.result); // will print out file content
});
reader.readAsText(blob);
})
.catch(function(error) {
console.error(error);
});
}
But I am getting this error as output
Promise {<pending>}
VM215:11 TypeError: reader.addEventListener is not a function
at <anonymous>:5:24
This is strange.
But if I store the response.fileBlob in a global variable and then use the reader function, it wont show the TypeError. But I still cant read the file contents.
Either way, these are the issues
1. In a function the FileReader is throwing an exception.
2. Outside the function, the FileReader is not showing the file contents.
PS - Testing in Cordova
Alright, Cordova has a different API
function downloadFile() {
dbx.filesDownload({path: '/_bk_test/test3.json'})
.then(function(response) {
var blob = response.fileBlob;
var reader = new FileReader();
reader.onloadend = function(evt) {
console.log("read success");
console.log(evt.target.result);
};
reader.readAsText(blob);
})
.catch(function(error) {
console.error(error);
});
}
Related
i'm using below method to upload files to laravel backend
setFile(id, e) {
let self = this;
let reader = new FileReader();
reader.readAsDataURL(e.target.files[0]);
reader.onload = function () {
console.log(reader.result);
self.documentArray.forEach(function (element) {
if (id == element.id && reader.result) {
element.file = reader.result;
element.file_browse_name = e.target.files[0].name;
}
});
};
reader.onerror = function (error) {
console.log('Error: ', error);
};
},
but when i select a file larger than 5mb or around, it doesn't add the element to the relevant object of the documentArray but it logs the result in console, so i cant add validation on backend. please give me a way to solve this problem
Maybe the problem is with your PHP settings. Check your upload_max_filesize and your post_max_size
I'm trying to read an appimage from the browser's drag and drop using JS and then saving it elsewhere using node.js FS module and I've tried with all of the browsers file reader options and none of them seem to work. (they all give me a file size different than the original file)https://developer.mozilla.org/en-US/docs/Web/API/FileReader
function saveMe(readFile,filename) {
var reader = new FileReader();
// Read file into memory as UTF-16
reader.readAsBinaryString(readFile, "UTF-16");
// Handle progress, success, and errors
reader.onprogress = ()=>{};
reader.onloadend = ()=>{
//console.log(reader.readyState);
if(reader.readyState==2){
//Create File './storage/apps/'+filename, reader.result
console.log(reader.result);
fs.writeFile('./storage/apps/'+filename,reader.result,(err)=>{
if(err){
console.log("Error While reading file");
}else{
}
});
}else{
}
};
reader.onerror = ()=>{console.log("Error reading file")};
}
Which method should I use?
- FileReader.readAsArrayBuffer()
- FileReader.readAsBinaryString()
- FileReader.readAsDataURL()
- FileReader.readAsText()
Read as UTF-16 and convert it to base64 when writing, also set the write options encoding to base64
function saveMe(readFile,filename) {
var reader = new FileReader();
// Read file into memory as UTF-16
reader.readAsBinaryString(readFile, "UTF-16");
// Handle progress, success, and errors
reader.onprogress = ()=>{};
reader.onloadend = ()=>{
//console.log(reader.readyState);
if(reader.readyState==2){
//Create File './storage/apps/'+filename, reader.result
//console.log(reader.result);
fs.writeFile('./storage/apps/'+filename,window.btoa(reader.result),{encoding: "base64"},(err)=>{
if(err){
console.log("Error While reading file");
}else{
}
});
}else{
}
};
reader.onerror = ()=>{console.log("Error reading file")};
}
my project have this foldes:
-html
index.html
-css
-js
my.js
-pdf
test.pdf
I need to convert this "test.pdf" to base 64 and send by POST
I try use a function like this:
function getBase64() {
var reader = new FileReader();
var file = new File("/pdf/test.pdf","r");
reader.addEventListener("loadend", function() {
// reader.result contains the contents of blob as a typed array
reader.readAsDataURL(file);
reader.onload = function () {
console.log(reader.result);
return reader.result;
};
reader.onerror = function (error) {
console.log('Error: ', error);
};
});
But I'm not the correct way to get past the folder path, or if I have to use another object and not File.
var file = new File("/pdf/test.pdf","r");
What's the best way to do it?
Thank you!
I am following this and I want to upload any type of file to OneDrive. It says that it accepts a buffer for the file content but my following code does not seem to work in case of any type of file. The file gets uploaded but it cannot be opened so the contents are messed up for sure.
Using the following method I am trying to get the body contents so that I can send them with the request.
private fileToBuffer(file: File): Observable<any> {
return Observable.create(observer => {
var arrayBuffer;
var fileReader = new FileReader();
fileReader.onload = function () {
arrayBuffer = this.result;
observer.next(arrayBuffer);
observer.complete();
};
fileReader.readAsArrayBuffer(file);
});
}
I did not notice that the Angular 2's http's PUT was taking the body as string. So, I resorted to using XHR to upload a file with its contents.
var oReq = new XMLHttpRequest();
oReq.open("PUT", url, true);
oReq.setRequestHeader("Content-Type", "text/plain");
oReq.onload = function(e){
console.log('done');
};
oReq.send(arrayBuffer);
I ran the following function with a valid file object but it didn't work. The read text was an empty string. However, when I run the same commands via the console, it does work.
function(file) {
console.log(file)
var reader = new FileReader();
reader.readAsText(file);
console.log(reader.readyState);
console.log(reader.result);
}
Why?
I needed to set a callback for when the reader finishes reading the file, as this is done asynchronously.
function(file) {
console.log(file)
var reader = new FileReader();
reader.onload = function() {
console.log(reader.readyState);
console.log(reader.result);
}
reader.readAsText(file);
}