Estoy tratando de usar React Native para publicar una imagen en una API remota. Para usar fetch(...) , necesito convertir una URL pública en un objeto de archivo. Yo uso el siguiente código.
const getFile = async (url: string, fileName: string) => { const response = await fetch(url, { method: "GET" }); const data = await response.blob(); const metadata = { type: "image/jpeg", }; const file = new File([data], fileName, metadata); return file; }; const myFile = await getFile("...IMG_URL...", "pic.jpg"); El código anterior funciona perfectamente bien en una consola de navegador. Pero cuando lo ejecuto usando React Native, obtengo un comportamiento ligeramente diferente. Por ejemplo, puedo usar console.log(myFile) en el navegador, imprime el archivo. Pero, si ejecuto console.log(myFile) en React Native, no lo hace.
Necesito que la imagen esté en un objeto de archivo porque necesito usarla en una llamada de fetch(...) :
const bodyData = new FormData(); bodyData.append("userId", "1"); bodyData.append("logId", "1"); bodyData.append("file", myFile); const response = await fetch( "...API_URL...", { method: "POST", body: bodyData, } );Sin embargo, ejecutar esto provoca el siguiente error, que no puedo interpretar:
Network request failed at node_modules\whatwg-fetch\dist\fetch.umd.js:535:17 in setTimeout$argument_0 at node_modules\react-native\Libraries\Core\Timers\JSTimers.js:130:14 in _callTimer at node_modules\react-native\Libraries\Core\Timers\JSTimers.js:383:16 in callTimers at node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:416:4 in __callFunction at node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:109:6 in __guard$argument_0 at node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:364:10 in __guard at node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:108:4 in callFunctionReturnFlushedQueue Sé que esto no es un problema con la conexión al servidor porque si ejecuto el mismo código sin el encabezado "file" , se conecta con éxito al servidor API.
Se me ha recomendado que use rn-fetch-blob , pero no puedo hacerlo porque rn-fetch-blob no es compatible con Expo.