ArrayBuffer when stringified becomes empty object [duplicate]

In my app, i'm uploading a file using FileReader and parsing it as an ArrayBuffer. The file properties are saved in an object, with structure like this:

file: { name: 'fileName', // type string content: ArrayBuffer // read like FileReader.readAsArrayBuffer(uploadedFile) } 

When I want to save the file to backend, I'm using axios, and sending a request like this:

axios({ url: "/api/v3/synchronous/commands", method: "POST", data: JSON.stringify(file), headers, }) 

The problem is that when it get's stringifed, content inside file becomes an empty object {}. How to go about this issue, without having to convert ArrayBuffer to something else, and then converting it back to ArrayBuffer?