可能未处理的承诺拒绝（id：0）React Native

Question

我正在尝试从我的 React 本机应用程序将文件上传到 AWS S3 存储桶，但出现此错误 -> 可能未处理的承诺拒绝（id：0） 这是代码：

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,
    }
})

这是我得到的输出，显示文件已正确选择，但将文件上传到 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 S3

我查看了其他问题和答案，但没有找到解决方案。我该如何解决这个错误？

Answer 1

你用 try/catch 包围了有问题的代码，这很好 - 但你 re-throwing 错误：

catch (err) {
    if(DocumentPicker.isCancel(err)) {
        console.log("user cancelled");
    }
    throw err;
}

这将导致未处理的拒绝，除非周围有 另一个 try/catch 或 .catch。

仅当调用堆栈上有更高级别的东西可以处理它时才抛出。在这种情况下，没有 - openDocumentFile 应该自己处理所有事情 - 所以不要 re-throw 以防出现问题。

catch (err) {
    if(DocumentPicker.isCancel(err)) {
        console.log("user cancelled");
    }
}

您还需要正确 await 对 RNS3.put 的调用 - 现在，它没有被等待，所以它没有连接到 try/catch .这个：

        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);
        });

应该是

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);

一般来说，不要混用 await 和 .then 除非你完全理解 Promises 并且知道你在做什么 - 否则，为了避免混淆自己，我建议只使用一个或另一个在特定的代码段中。 await（和try/catch），或使用.then，但不能在异步逻辑的同一部分。

可能未处理的承诺拒绝（id：0）React Native

Possible Unhandled Promise Rejection (id: 0) React Native

javascript

amazon-s3

promise

react-native