Why formdata info inside file?

I'm trying to upload a file to Azure cloud service using a FormData in React Native, but the uploaded file ends up like this:

In the file's beginning and end has what I believe to be form data info:file beginning,file end

Because of this behavior, the image doesn't open.

If I manually remove those beginning/end lines, the image opens as normal.

The way I'm doing it works normal in Postman and Angular, and on those I'm also using the same service, account etc.

What changed is now I'm trying to do same thing, but on React Native.

My environment:

• React Native Typescript with expo.
• Test device: SmartPhone with Android 12. I've tested with previous versions (6,7,9 and 10) and the same problem happens.

You can download and see the uploaded file here:https://apiblobemerson.blob.core.windows.net/volpevertichomolog/checkListID4itemID15Imagem_aa890b25c97fccf6288c18ba9bbc7ce3.jpg

The ways I tried to do on React native:

The form data:

const bodyFormData = new global.FormData();bodyFormData.append(arquivo.name,{    uri: uriPath,        // File Path    type: 'image/jpeg',  // File Type    name: arquivo.name,  // File Name}, arquivo.name);

Fist try - Axios with only put:

const config = {    headers: {'x-ms-blob-type': 'BlockBlob'    }};axios.put(urlEnvio, bodyFormData, config).then(response => {    resolve(response);}).catch(error => {    reject(error);});

Second try - Axios with request and put:

axios.request({    url: urlEnvio,    method: 'put',    data: bodyFormData,    transformRequest: (data, headers) => {        // override data to return formData        // since axios converts that to string        return bodyFormData;    },    headers: {'x-ms-blob-type': 'BlockBlob'    },}).then(response => {    resolve(response);}).catch(error => {    reject(error);});

Third try - Using Fetch:

fetch(urlEnvio, {    method: "PUT",    headers: {"x-ms-blob-type": "BlockBlob"    },    body: bodyFormData}).then(response => {    resolve(response);}).catch(error => {    reject(error);});

On angular I create the form data using directly the file:

/** * Envia arquivo para armazenamento azure * * @param urlEnvio - URL de envio, pode mudar com o tempo * @param arquivo - Arquivo selecionado para ser enviado para o azure * * @returns Retorno Retorna status 201/200 em caso de sucesso * */azureEnviarArquivo(urlEnvio: string, arquivo: File): Observable<any> {    const formData: FormData = new FormData();    formData.append(arquivo.name, arquivo);    let headers = new HttpHeaders()    headers = headers.set('x-ms-blob-type', 'BlockBlob');    headers = headers.set('skip-volpeweb-token', '');    return this.http.put<any>(urlEnvio, arquivo, { 'headers': headers } );}

If I try to do the same on React Native, the file ends up empty.That's why I using the Uri path in the FormData in React Native.

It doesn't matter if those headers info are or not on the request, the file ends up with content-disposition, Content-Type and Content-Length inside the file.

On Postman and Angular works, why does this happen using React Native?If was a problem with Azure cloud service, the other 2 would have the same behavior, right?