Estoy tratando de cargar archivos en el depósito de AWS S3 desde mi aplicación nativa de reacción, pero aparece este error -> Posible rechazo de promesa no controlada (id: 0) Aquí está el código:
import { View, Text, StyleSheet, TouchableOpacity } from 'react-native' import DocumentPicker from 'react-native-document-picker'; import { RNS3 } from 'react-native-aws3'; import Colors from '../constants/Colors'; const Upload = (props) => { async function openDocumentFile() { try { const res = await DocumentPicker.pickSingle({ type: [DocumentPicker.types.allFiles], }); console.log( res.uri, res.name, res.type, res.size ); const file = { uri: res.uri, name: res.name, type: res.type, } const options = { keyPrefix: "uploads/", bucket: '', region: 'ap-south-1', accessKey: '', secretKey: '', successActionStatus: 201 } RNS3.put(file, options) .then(response => { if (response.status !== 201){ console.log(response.status); throw new Error("Failed to upload image to S3"); } console.log(response.body); }); } catch (err) { if(DocumentPicker.isCancel(err)) { console.log("user cancelled"); } throw err; } } return ( <View style={styles.view}> <TouchableOpacity style={styles.button} onPress={openDocumentFile}> <Text style={styles.text}>Upload Documents</Text> </TouchableOpacity> </View> ) } export default Upload; const styles = StyleSheet.create({ view: { flex: 1, justifyContent: 'center', alignItems: 'center', }, button: { justifyContent: 'center', alignItems: 'center', color: Colors.white, padding: 10, borderColor: Colors.primary, borderWidth: 1, }, text: { color: Colors.primary, } })Aquí está el resultado que obtengo, que muestra que el archivo se seleccionó correctamente, pero hay un error en el código para cargar el archivo en AWS-S3:
LOG content://com.android.providers.downloads.documents/document/msf%3A31 helloWorld.jpeg image/jpeg 26150 LOG 400 WARN Possible Unhandled Promise Rejection (id: 0): Error: Failed to upload image to S3Revisé otras preguntas y respuestas, pero no encontré una solución. ¿Cómo puedo solucionar este error?
Está rodeando el código problemático con try / catch , lo cual es bueno, pero luego está volviendo a generar el error:
catch (err) { if(DocumentPicker.isCancel(err)) { console.log("user cancelled"); } throw err; } lo que dará como resultado un rechazo no controlado a menos que haya otro try / catch o .catch alrededor de eso.
Solo lanza si hay algo más arriba en la pila de llamadas que pueda manejarlo. En este caso, no lo hay, openDocumentFile debería manejar todo por sí mismo, así que no vuelva a lanzarlo en caso de que haya un problema.
catch (err) { if(DocumentPicker.isCancel(err)) { console.log("user cancelled"); } } También debe await correctamente la llamada a RNS3.put ; en este momento, no se está esperando, por lo que no está conectado con try / catch . Este:
RNS3.put(file, options) .then(response => { if (response.status !== 201){ console.log(response.status); throw new Error("Failed to upload image to S3"); } console.log(response.body); });debiera ser
const response = await RNS3.put(file, options) if (response.status !== 201){ console.log(response.status); throw new Error("Failed to upload image to S3"); } console.log(response.body); En general, no mezcle await y .then a menos que comprenda completamente Promises y sepa lo que está haciendo; de lo contrario, para evitar confundirse, recomendaría usar solo uno u otro en un segmento de código en particular. await (y try / catch ), o use .then , pero no ambos en la misma sección de lógica asíncrona.