So i have an API which takes only ByteArray for Images,i just wanted to know how to do that,I've used Expo's ImagePicker
let pickerResult = await ImagePicker.launchCameraAsync({
allowsEditing: true,
aspect: [4, 3],
});
and i'm trying to convert this URI to Base64 and then Base64 to ByteArray,but the image is getting messed up somewhere and i'm not able to get the integrity of the image,
this is my conversion
function test(base64StringFromURL)
{
var parts = base64StringFromURL.split(";base64,");
var contentType = parts[0].replace("data:", "");
var base64 = parts[1];
var byteArray = base64ToByteArray(base64);
//console.log("ByteARRAY "+byteArray);
return byteArray;
}
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();
}
function base64ToByteArray(base64String) {
try {
var base64 = require('base-64');
var sliceSize = 1024;
var byteCharacters = base64.decode(base64String);
var bytesLength = byteCharacters.length;
var slicesCount = Math.ceil(bytesLength / sliceSize);
var byteArrays = new Array(slicesCount);
for (var sliceIndex = 0; sliceIndex < slicesCount; ++sliceIndex) {
var begin = sliceIndex * sliceSize;
var end = Math.min(begin + sliceSize, bytesLength);
var bytes = new Array(end - begin);
for (var offset = begin, i = 0; offset < end; ++i, ++offset) {
bytes[i] = byteCharacters[offset].charCodeAt(0);
}
byteArrays[sliceIndex] = new Uint8Array(bytes);
}
return byteArrays;
} catch (e) {
console.log("Couldn't convert to byte array: " + e);
return undefined;
}
}
I'm not sure what i'm missing here,this i how i'm sending my data to API
let options = {
method: 'POST',
body: JSON.stringify({
CustomerId: custData.customerId,//'68c439f8-c474-46a9-84b8-79fe31168563',
CustomerName: custData.customerName,
UserId:'user2',
VehicleCompanyName:custData.vehicleCompanyName,
VehicleModelType:custData.vehicleModelType,
VehicleNumber:custData.vehicleNumber,
CustomerImage:bytearray,
Location:'',
CustomerImageType:'jpg'
}),
headers: new Headers({
'Content-Type': 'application/json', // <-- Specifying the Content-Type
}),
};
return fetch(apiUrl, options);
the byteArray variable is nothing but the returned variable of method test()
Any Inputs would be really helpful,or any other approach would also help me.
