@shantanukumar847 Another try to ask ^^
Ok, my question is, why do i need this …
const fetch = require('node-fetch'); //NPM package I like using but you can use wix-fetch
let buffer = await create_buffer(); //This is the buffer
let encoded_file = await encoder(buffer); //This is the base64 encoded result
const create_buffer = () => {
return fetch(YOUR_URL, {
method: 'GET',
encoding: null
})
.then( (res) => {
return res.buffer(); //This is the buffer
});
}
const encoder = (string) => {
var encryptedBytes = Buffer.from(string);
var encoded = encryptedBytes.toString('base64');
return encoded;
}
When i am forced to use HTML-Component to make a FILE-SELECTION, i also can use the HTML-Component to make buffer and UPLOAD directly aswell, right?
The NPM-Package would be useless in this case, or do i mix-up something?
<html>
<head>
</head>
<body id="body" style="text-align:center;">
<input type="file", name="fileSelector1", id="fileSelector", accept="image/*", onchange="openFile(event)", multiple><br>
<div>
<p id="imgElement" style="color:green; font-size: 20px; font-weight: bold;"></p>
</div>
<script type="text/javascript">
//-----------------------------------------------
var openFile = async function(event) {var data={};
var input = await event.target;
var inputDATA = input.files[0];
var fileName = inputDATA.name;
var fileType = inputDATA.type;
var fileSize = inputDATA.size;
var accepted = input.accept;
var filesTotal = input.files.length;
//------------------------------------
var reader = new FileReader();
reader.onloadend = async function (event) {var img = new Image();
img.src = await event.target.result;
img.onload = function () {
data.height = img.height;
data.width = img.width;
data.fileName = fileName;
data.fileSize = fileSize;
data.fileType = fileType;
data.filesTotal = filesTotal;
data.accepted = accepted;
data.base64 = img.src;
if (filesTotal>=0) {window.parent.postMessage(data,"*");}
};
};
reader.readAsDataURL(inputDATA);
//-----------------------------------
window.onmessage = (async(event) => {
var uploadURL = event.data;
var formData = await new FormData();
formData.append('upload_token', '');
formData.append('file', inputDATA);
let request = await new XMLHttpRequest();
request.open("POST", uploadURL);
request.responseType = "json";
request.onreadystatechange = function() {
if (request.readyState == XMLHttpRequest.DONE) {
const response = request.response;
let resultUrl = 'https://static.wixstatic.com/media/' + response[0].file_name;
data.fileInfo=request.response[0];
window.parent.postMessage(data,"*");
}
}
request.send(formData);
});
};
//-----------------------------------
</script>
</body>
</html>