C
C#2y ago
İrşat

✅ End point can't take byte[] from HTTP Request. Only int[].

//model
public int[]? coverImage { get; set; }
//model
public int[]? coverImage { get; set; }
//In a function
var coverimg_file = coverImg_input.files;
if (coverimg_file && coverimg_file[0]) {
var file = coverimg_file[0];
formData.coverImage = await ImageToByteArray(file);
//coverImage!: Number[] | null;
//ArrayBuffer type didn't work, idk i didn't dig in too much
}

async function ImageToByteArray(file: File): Promise<Number[] | null> {
return new Promise((resolve) => {
const reader = new FileReader()
reader.onloadend = () => {
var data = reader.result as ArrayBuffer | null;
if (data != null) {
return resolve([...new Uint8Array(data)]);
}
else {
return resolve(null);
}
};
reader.readAsArrayBuffer(file);
})
}

//Fetch init;
{
method: 'POST',
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json'
},
body: JSON.stringify(formData)
}
//In a function
var coverimg_file = coverImg_input.files;
if (coverimg_file && coverimg_file[0]) {
var file = coverimg_file[0];
formData.coverImage = await ImageToByteArray(file);
//coverImage!: Number[] | null;
//ArrayBuffer type didn't work, idk i didn't dig in too much
}

async function ImageToByteArray(file: File): Promise<Number[] | null> {
return new Promise((resolve) => {
const reader = new FileReader()
reader.onloadend = () => {
var data = reader.result as ArrayBuffer | null;
if (data != null) {
return resolve([...new Uint8Array(data)]);
}
else {
return resolve(null);
}
};
reader.readAsArrayBuffer(file);
})
}

//Fetch init;
{
method: 'POST',
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json'
},
body: JSON.stringify(formData)
}
If I use byte[] type, it gives me null.
30 Replies
Dusty
Dusty2y ago
The endpoint on the server? Normally u dont combine formdata and json
İrşat
İrşatOP2y ago
How else am I gonna do?
Pobiega
Pobiega2y ago
json can't serialize byte[] you either base64 the bytes, if you wanna keep it json, or you use HTTP file transfer
İrşat
İrşatOP2y ago
Former, I want to use the former.
Pobiega
Pobiega2y ago
okay, then just base64 the byte array into a string, then reverse that in the client
İrşat
İrşatOP2y ago
That went over my head.
Pobiega
Pobiega2y ago
set your models datatype to "string"
İrşat
İrşatOP2y ago
Then turn it into byte array? in back end
Pobiega
Pobiega2y ago
wait, in what direction are you doing this? are you sending data from client to backend, or from backend to client?
İrşat
İrşatOP2y ago
client to backend lol I am using fetch
Pobiega
Pobiega2y ago
ok that should still work fine
Pobiega
Pobiega2y ago
atob() - Web APIs | MDN
The atob() function decodes a string of data which has been encoded using Base64 encoding. You can use the btoa() method to encode and transmit data which may otherwise cause communication problems, then transmit it and use the atob() method to decode the data again. For example, you can encode, transmit, and decode control characters ...
Pobiega
Pobiega2y ago
use this to turn your byte array into a string err, maybe btoa yeah, btoa => string
İrşat
İrşatOP2y ago
Argument of type 'Number[] | null' is not assignable to parameter of type 'string'. Type 'null' is not assignable to type 'string'. It wants a string.
Pobiega
Pobiega2y ago
You're having TS problems at this point, but at least show the code in question cant very well guess what the hell you did
İrşat
İrşatOP2y ago
It's the await ImageToByteArray(file), everything is up there in my first comment. I did something like const asdf = btoa(await ImageToByteArray(file));
Pobiega
Pobiega2y ago
https://stackoverflow.com/questions/9267899/arraybuffer-to-base64-encoded-string ? var base64String = btoa(String.fromCharCode.apply(null, new Uint8Array(arrayBuffer))); or const base64String = btoa(String.fromCharCode(...new Uint8Array(arrayBuffer)));
[HttpPost]
public IActionResult Test(ByteArrayModel model)
{
var data = Convert.FromBase64String(model.Content);
var joined = string.Join(", ", data.Select(x => Convert.ToString(x)).ToArray());

return Ok(joined);
}
[HttpPost]
public IActionResult Test(ByteArrayModel model)
{
var data = Convert.FromBase64String(model.Content);
var joined = string.Join(", ", data.Select(x => Convert.ToString(x)).ToArray());

return Ok(joined);
}
this works fine. obviously, you'd do something with data (which is a byte[]) instead of just printing the bytes 🙂
İrşat
İrşatOP2y ago
async function ArrayBufferToBase64(file: File): Promise<string | null> {
return new Promise((resolve) => {
const reader = new FileReader()
reader.onloadend = () => {
var buffer = reader.result as ArrayBuffer | null;
if (buffer != null) {
var binary = '';
var bytes = new Uint8Array(buffer);
var len = bytes.byteLength;
for (var i = 0; i < len; i++) {
binary += String.fromCharCode(bytes[i]);
}
return resolve(window.btoa(binary));
}
else {
return resolve(null);
}
};
reader.readAsArrayBuffer(file);
})
}
async function ArrayBufferToBase64(file: File): Promise<string | null> {
return new Promise((resolve) => {
const reader = new FileReader()
reader.onloadend = () => {
var buffer = reader.result as ArrayBuffer | null;
if (buffer != null) {
var binary = '';
var bytes = new Uint8Array(buffer);
var len = bytes.byteLength;
for (var i = 0; i < len; i++) {
binary += String.fromCharCode(bytes[i]);
}
return resolve(window.btoa(binary));
}
else {
return resolve(null);
}
};
reader.readAsArrayBuffer(file);
})
}
Successfully turned the array into string It's super duper long tho 😄 the string it gave me i mean
Pobiega
Pobiega2y ago
well yes representing an image as a string isnt very space efficient
İrşat
İrşatOP2y ago
would it have problem with traffic? Costs more? Let me do the reverse too in the meantime
Pobiega
Pobiega2y ago
byte[] Convert.FromBase64String(string input) is all you need on the server side
İrşat
İrşatOP2y ago
what about joined
Pobiega
Pobiega2y ago
that was just something I had to "debug" it ie, print the raw bytes
İrşat
İrşatOP2y ago
I see
Pobiega
Pobiega2y ago
you probably don't want to do that :p
İrşat
İrşatOP2y ago
Let's try this bad boy now
İrşat
İrşatOP2y ago
Heh heee boooii
Pobiega
Pobiega2y ago
"Internet guy", really? 😛
İrşat
İrşatOP2y ago
Thank you, kind internet guy Let's close this, once again thank you. /close
Want results from more Discord servers?
Add your server