Al intentar cargar un archivo en Amazon S3 usando axios, me encontré con un problema muy extraño. Normalmente, en un navegador web, cuando FormData tiene datos binarios, el encabezado Content-Type se establece automáticamente en multipart/form-data; boundary=<some random string> . Sin embargo, no he podido lograrlo en React Native (probando en un dispositivo iOS). El Content-Type se establece automáticamente en application/json y, por lo tanto, no se detecta como un cuerpo con el formato correcto cuando se carga en Amazon S3. Intenté especificar un blob en el parámetro del archivo en FormData en lugar del URI del archivo, pero fue en vano. He adjuntado mi código a continuación, cualquier consejo sería muy apreciado.
const uploadFileToS3 = ( presignedPostData, file) => { // create a form obj const formData = new FormData(); // append the fields in presignedPostData in formData Object.keys(presignedPostData.fields).forEach( key => { formData.append( key, presignedPostData.fields[key], ); }, ); // append the file and uplaod const getBlob = async () => { const img_url = previewPath; let result = await fetch(img_url); const blob = await result.blob(); formData.append('Content-Type', 'image/jpeg'); formData.append('file', { uri: previewPath, type: 'image/jpeg', name: 'test.jpeg', }); console.log(formData, 'wild'); // post the data on the s3 url axios .post(presignedPostData.url, formData) .then(function (response) { console.log(response); }) .catch(function (error) { console.log(error.response); }); }; getBlob(); };