重新编译后无法从旧版本的应用程序加载文件

Question

我的 React Native 应用程序存在以下问题。该应用程序将一些 PDF 文件存储为文件并能够访问它们。然后可能在重新编译之后应用程序开始在访问这些文件时出现问题。但是，文件仍然存在。我下载了应用程序的完整数据容器进行检查。

我怀疑是因为应用程序的数据容器 URI 中有一个动态部分在重新编译后总是更改，后面跟着实际路径？例如D22506C1-9364-43A4-B3C7-F9FFF0E1CC48、6BDC3F93-6BC3-4BB6-BD3F-9BFA7E4A4627

如果是这样，将 React Native 中的 URI 存储在数据库中以便再次检索它们的最佳做法是什么？

以下 6 个 PDF 文件：

ListViewItem.js:30 Debug: Report URI /var/mobile/Containers/Data/Application/D22506C1-9364-43A4-B3C7-F9FFF0E1CC48/Documents/Reports/dk79lqddh3mlkcstqel9.pdf
ListViewItem.js:30 Debug: Report URI /var/mobile/Containers/Data/Application/D22506C1-9364-43A4-B3C7-F9FFF0E1CC48/Documents/Reports/e1exw1qg4cs6czktrfkfvi.pdf
ListViewItem.js:30 Debug: Report URI /var/mobile/Containers/Data/Application/D22506C1-9364-43A4-B3C7-F9FFF0E1CC48/Documents/Reports/zfy6hp3zf42me5ru32jfa.pdf
ListViewItem.js:30 Debug: Report URI /var/mobile/Containers/Data/Application/D22506C1-9364-43A4-B3C7-F9FFF0E1CC48/Documents/Reports/fum4qf23mwnzcmye39xau.pdf
ListViewItem.js:30 Debug: Report URI /var/mobile/Containers/Data/Application/D22506C1-9364-43A4-B3C7-F9FFF0E1CC48/Documents/Reports/btksznt1lxv7k4ey23bw93.pdf
ListViewItem.js:30 Debug: Report URI /var/mobile/Containers/Data/Application/6BDC3F93-6BC3-4BB6-BD3F-9BFA7E4A4627/Documents/Reports/smpkiggii4v7xmfhpnmdi.pdf

无法在应用程序的不同位置加载的 URI：

示例 1

<Pdf style={styles.image} source={{ uri: 'file://' + this.props.pdf }} />

示例 2

FileService.readFileFromStorage('file://' + this.report.report_uri, 'base64')    

static readFileFromStorage(path, encoding) {
    return new Promise((resolve, reject) => {
        RNFS.readFile(path, encoding)
            .then((file) => {
                resolve(file);
            })
            .catch((err) => {
                console.log('Error: unable to read file', path, err.message);
                reject(err)
            });
    })

}

这是用来写文件的：

FileService.writeFiletoStorage(r.taskId, 'pdf', base64Str)

static writeFiletoStorage(fileName, extention, base64Str) {
    return new Promise((resolve, reject) => {
        RNFS.mkdir(RNFS.DocumentDirectoryPath + '/Reports')
        var path = RNFS.DocumentDirectoryPath + '/Reports/' + fileName + '.' + extention;

        return RNFS.writeFile(path, base64Str, 'base64')
            .then((success) => {
                console.log('FILE WRITTEN!', path, success);
                resolve(path);
            })
            .catch((err) => {
                console.log('Error: unable to write file to storage', path, err.message);
                reject(err)
            });
    })

}

Answer 1

写入文件的方法返回完整路径，不同的编译不同。只返回相对路径效果更好：

static writeFiletoStorage(fileName, extension, base64Str) {
        return new Promise((resolve, reject) => {
            RNFS.mkdir(RNFS.DocumentDirectoryPath + 'Reports')
            let path = '/Reports/' + fileName + '.' + extension;
            let fullPath = RNFS.DocumentDirectoryPath + path;

            return RNFS.writeFile(fullPath, base64Str, 'base64')
                .then((success) => {
                    console.log('FILE WRITTEN!', fullPath, success);
                    resolve(path);
                })
                .catch((err) => {
                    console.log('Error: unable to write file to storage', fullPath, err.message);
                    reject(err)
                });
        })

    }

必须对读取文件的方法进行相同的更改：

static readFileFromStorage(path, encoding) {
    return new Promise((resolve, reject) => {
        let fullPath = RNFS.DocumentDirectoryPath + path;
        RNFS.readFile(fullPath, encoding)
            .then((file) => {
                resolve(file);
            })
            .catch((err) => {
                console.log('Error: unable to read file', fullPath, err.message);
                reject(err)
            });
    })

}

重新编译后无法从旧版本的应用程序加载文件

Unable to load files from an old version of an app after recompiling it

filesystems

android

ios

react-native

react-native-fs