I am interested to know what base64 is, since I found a script that receives an image and converts it into a data:image link and this can be displayed anywhere on the internet without uploading it to a server.
Why? what is it that makes it able to be shown anywhere without uploading it to a server.
Where they are hosted, how many images can be generated, browsers that support it, the lifetime of the files and if it can only be done with images.
function readFile(input) {
if (input.files && input.files[0]) {
var reader = new FileReader();
reader.onload = function (e) {
var filePreview = document.createElement('img');
filePreview.id = 'file-preview';
//e.target.result contents the base64 data from the image uploaded
filePreview.src = e.target.result;
console.log(e.target.result);
var previewZone = document.getElementById('file-preview-zone');
previewZone.appendChild(filePreview);
}
reader.readAsDataURL(input.files[0]);
}
}
var fileUpload = document.getElementById('file-upload');
fileUpload.onchange = function (e) {
readFile(e.srcElement);
}
What is base64?
Simple base64 is a 'Variable string' that contains all the information of the image and all its data.
When you use it it can work as a link because it's the whole image/Or another file that you've converted to base64.
You can even save it to a database and call it in JavaScript and place it in a src of an img tag .