We Keep Coding

Convert in to FileObject from imageUrl using Javascript( on any JS frameworks mostly React)

I do have image url handy , probably an drop box url
https://www.dropbox.com/s/tcg73i4bxbu423g/gradient-test.jpg?dl=0
How to get the fileobject for the same , since my backend api accept only file object , is there any way i can get file object.
I am expecting the below object format . is there any way guys
it will be great if any fiddle is applicable
Note: is it possible to convert without any external api .
any answers will be highly helpful & thankful

You can load image as a file use below function(link, #HaNdTriX). And the url you provided is not an image url so you should extract the image path first.
function toDataUrl(url, callback) {
var xhr = new XMLHttpRequest();
xhr.onload = function() {
var reader = new FileReader();
reader.onloadend = function() {
callback(reader.result);
}
reader.readAsDataURL(xhr.response);
};
xhr.open('GET', url);
xhr.responseType = 'blob';
xhr.send();
}
imagepath = "https://uc5d3934b120724e8be5a303a2af.previews.dropboxusercontent.com/p/thumb/AA2-rSW7gi7La52QQXPE_mXgt-ssFnHje-5SnLKNxXuTD_qtYtjackFxZTyn3SWQDCLEw66TdZeqa4hMdd33pGxoaXMufvP5XVRPlGZr_a8WJ_OgxphXn45cTKbFHXD2e7I4PcYgSnkBOiYpfqNK_GcMJvTlZskkWvsUwiqopClEkh_4_GDNQcOE-Po8puDE9koQuMnAh6q0Ig4-eZ3xyZO_X-fC9Z9M7niTHGbLAgpVlYWyyKLGFpgVJHD8jpZ1F38c2V8H8M6c4emhMaWr1bEBo4WWxjFHThLj1f1vDrWEv7Z18ZEro-bekrZRh_AwH7oxIBmYFZYhA91c6OMXAFiCdOX0hwRwhMJVxruschBy8bHqVkm2II5wTnDj6IbGlu5uatEt6LVVbLv0U2ZGlmSq/p.jpeg?fv_content=true&size_mode=5"
toDataUrl(imagepath, function(myBase64) {
console.log(myBase64); // myBase64 is the base64 string
});

Javascript string encoding Windows-1250 to UTF8

I've an angularjs app that receive data from an external webservice.
I think I'm receiving UTF-8 string but encoded in ANSI.
For example I get
KLMÄšLENÃ
When I want to display
KLMĚLENÍ
I've tried to use decodeURIComponent to convert it but that doesn't work.
var myString = "KLMÄšLENÃ"
console.log(decodeURIComponent(myString))
I'm probably missing something but I can't find what.
Thanks and regards,
Eric

You can use TextDecoder. (Be beware! some browser does not support it.)
var xhr = new XMLHttpRequest();
xhr.open('GET', url);
xhr.responseType = 'arraybuffer';
xhr.onload = function() {
if (this.status == 200) {
var dataView = new DataView(this.response);
var decoder = new TextDecoder("utf-8");
var decodedString = decoder.decode(dataView);
console.log(decodedString);
} else {
console.error('Error while requesting', url, this);
}
};
xhr.send();
Java servlet code for simulating server side output:
resp.setContentType("text/plain; charset=ISO-8859-1");
OutputStream os = resp.getOutputStream();
os.write("KLMĚLENÍ".getBytes("UTF-8"));
os.close();

Ajax response is null for word docs, fine for txt and pdf

I'm attempting to use an ajax request to get a file via binary data, and then convert it into base64. This works fine for txt and pdf files, but fails when I try a docx. Response is null, and ResponseText is a DOMExpection. If I go to the url directly in chrome, it downloads the file fin. Is there anything special about docx files? Here's my code.
function _arrayBufferToBase64(buffer) {
var binary = '';
var bytes = new Uint8Array(buffer);
var len = bytes.byteLength;
for (var i = 0; i < len; i++) {
binary += String.fromCharCode(bytes[i]);
}
return window.btoa(binary);
}
function download(fileName, fileDownloadLocation) {
var oReq = new XMLHttpRequest();
oReq.onload = function(data) {
var base64str = _arrayBufferToBase64(this.response);
//Do custom stuff here
};
oReq.responseType = "arraybuffer";
oReq.open("get", fileDownloadLocation, true);
oReq.send();
}
I've also tried screwing with the Accept headers, but no luck. I call this right after open.
oReq.setRequestHeader('Accept', 'application/vnd.openxmlformats-officedocument.wordprocessingml.document,application/octet-stream,text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8');

It turns out this only happens when files have a length of 0.

Use filedata instead of file attribute to pass data

I'm trying to render vtk objects which are send from a webserver directly on the client using XTK without storing them to the disk. According to the XTK Documentation I just have to pass the vtk file as string into X.Mesh.filedata, but it just doesn't display anything when I'm trying to do that.
I want to do something like this:
var data = recieveVTKFileAsStringFromServer();
var r = new X.renderer3D();
r.init();
// create a mesh from a .vtk file
var dataset = new X.mesh();
// dataset.file = 'someFile.vtk';
dataset.filedata = data;
// add the object
r.add(dataset);
// .. and render it
r.render();
When I load the file from the file everything works just fine, setting it using filedata doesn't. Where is my mistake?

I also came up with the similar scenario to load the binary data directly using filedata instead of setting file attribute. I did this by passing dummy name in a file attribute along with actual binary data set in filedata and everything works fine.
var xhr = new XMLHttpRequest();
xhr.open('GET', '/test.nii', true);
xhr.responseType = 'arraybuffer';
xhr.send();
xhr.onreadystatechange = function (e) {
if (this.readyState === 4) {
var r = new X.renderer2D();
r.container = 'myImg';
r.orientation = 'Z';
r.init();
volume = new X.volume();
volume.file = "abc.nii";
volume.filedata = this.response;
r.add(volume);
r.render();
}
};

Converting pdf(encoding:UniJIS-UCS2-H) to base64

I have a pdf with encoding UniJIS-UCS2-H. i want to convert it in to base 64 in javascript.
i wrote the code like this. It converting it in to pdf but the content is not visible.
my code is showing below.
function getBinary(file){
var xhr = new XMLHttpRequest();
xhr.open("GET", file, false);
xhr.overrideMimeType("application/pdf; charset=UniJIS-UCS2-H");
xhr.send(null);
return xhr.responseText;
}
function base64encode(binary) {
return btoa(unescape(encodeURIComponent(binary)));
}
var binary = getBinary('http://localhost/first.pdf');
var base64encoded = base64encode(binary);
data = "data:application/pdf;base64,"+base64encoded;
the data is contain only a plain pdf. how can i resolve it ?