Converting readAsBinaryString to Data:URI - javascript

I have a binaryString variable as readAsBinaryString. How can I convert it to data:uri?
var reader = new FileReader();
reader.onloadend = function () {
var binaryString = reader.result;
console.log(binaryString);
console.log(window.btoa(binaryString));//does not contain mime-type at the beginning
}
var file=document.getElementById("fileToUpload").files[0];
reader.readAsBinaryString(file);
I need to operate over directly binaryString. I am sending the binaryString to another Javascript application. So in that context I only have binaryString value. The code above is just an example. Please do not recommend URL.createObjectURL or FileRader.readAsDataURL.
I need to operate over binaryString directly and convert it data:uri.

Related

how can i generate base64 string from local audio file

how can i generate base64 string from local audio file?
i needed for send after via socket.io as base 64 string
i use angularjs actually
angular.module('starter.controllers', [])
.controller('DashCtrl', function () {
var handleFileSelect = function (evt) {
var file = evt.target.files[0];
var reader = new FileReader();
// this is the path of the file that i will have to send to the server
// /android_asset/www/sounds/button-1.mp3
reader.onload = function (readerEvt) {
var binaryString = readerEvt.target.result;
document.getElementById("base64textarea").value = btoa(binaryString);
};
reader.readAsBinaryString(file);
};
});

How to checksum the file to be uploaded with javascript?

I want to checksum the files at browser side before uploading, then checksum and compare at server side to make sure the consistent. But how can I get the pure binary data of the file and checksum it? I tried the way below, but doesn't work:
let fileSelect = document.getElementById('file')
let files = fileSelect.files
let file = files[0]
var r = new FileReader();
r.onload = function(){ console.log(r.result); };
r.readAsArrayBuffer(file);
var file_sha1 = sha1(r.result)
The library you are using seems to support string input only.
Find a library support binary input. Eg. js-sha1. And you should hash it in the callback.
var reader = new FileReader();
reader.onload = function (event) {
var file_sha1 = sha1(event.target.result)
};
reader.readAsArrayBuffer(file);

Reading PNG binary data in JAVASCRIPT

var uint8 = new Uint8Array(plaintext);
var arrayBuffer = uint8.buffer;
var blob = new Blob([arrayBuffer]);
var reader = new FileReader();
reader.onload = function(){
var dataURL = reader.result;
console.log('DATAURL');
console.log(dataURL);
};
reader.readAsBinaryString(blob);
plaintext - is a png binary data, the problem is that dataURL comes empty am I do everything right in the code, or the problem may be in the binary data itself?

Javascript split blob as strings

Say you parse a text file with fileReader:
function show() {
var file = document.getElementById('myFile');
var data = file.files[0];
var fileRead = new FileReader();
fileRead.onload = function() { document.getElementById('out').appendChild(document.createTextNode(' ' + fileRead.result)) }
fileRead.readAsText(data);
}
How do you split a blob object (raw data) with the split function which works only on strings?
If I convert the blob to string and then call readAsText it reasonably complains that the data variable (containing text) is not a blob object.
So, basically I want to use the split function on the blob text object.
You can just do it in the onload callback.
var file = document.getElementById('myfile');
var data = file.files[0];
var var fileReader = new FileReader();
fileReader.onload = function() {
let strings = fileReader.result.split(' ');
strings.forEach(function(string) {
//Your code here
})
}
fileReader.readAsText(data)
If you want blob objects representing each split string, you would have to build the blob objects in the foreach loop.

Using HTML 5 File API to load a JSON file

I want the user to be be able to chose a JSON file on there computer, this JSON file should then be made available to the client side Javascript.
How would I do this using the FILE API, the ultimate goal is the the user selected JSON file to be available as an object which I can then play about with in Javascript. This is what I have so far:
JsonObj = null
function handleFileSelect(evt) {
var files = evt.target.files; // FileList object
f = files[0];
var reader = new FileReader();
// Closure to capture the file information.
reader.onload = (function(theFile) {
return function(e) {
// Render thumbnail.
JsonObj = e.target.result
console.log(JsonObj);
};
})(f);
// Read in the image file as a data URL.
reader.readAsDataURL(f);
}
document.getElementById('files').addEventListener('change', handleFileSelect, false);
FIDDLE: http://jsfiddle.net/jamiefearon/8kUYj/
How would I convert the variable JsonObj to a proper Json object, one can can add new fields to etc.
Don't load the data as a "DataUrl" via readAsDataURL, instead use readAsText then parse it via JSON.parse()
e.g.
JsonObj = null
function handleFileSelect(evt) {
var files = evt.target.files; // FileList object
f = files[0];
var reader = new FileReader();
// Closure to capture the file information.
reader.onload = (function(theFile) {
return function(e) {
// Render thumbnail.
JsonObj = JSON.parse(e.target.result);
console.log(JsonObj);
};
})(f);
// Read in the image file as a data URL.
reader.readAsText(f);
}
document.getElementById('files').addEventListener('change', handleFileSelect, false);

Categories

Resources