0

因此,我使用react-native-fs从 url 下载文件,然后打开以查看/共享/打印它们react-native-file-viewer。这适用于 iOS,但在 Android 上存在问题。我假设文件正在正确下载,因为在传递FileViewer文件路径时它会“打开”文件。虽然,所显示的只是一个空白屏幕。

这是我的实现:

  const fileName = 'AnImageFile.png';
  const dir = RNFS.DocumentDirectoryPath;
  const filePath = dir + '/' + fileName;

  const options = {
    fromUrl: url,
    toFile: filePath,
  };

  RNFS.downloadFile(options)
  .promise.then(() => FileViewer.open(filePath, {showOpenWithDialog: true, showAppsSuggestions: true}))
  .then(() => {
    console.log('File should have opened');
    // Hits here, opens blank on Android
  })
  .catch((error) => {
    console.log('There was an error opening the file');
    console.log(error);
  });

正在打开的图像的屏幕截图

我也尝试过使用rn-fetch-blob而不是react-native-fs下载文件。但是当从中传递FileViewer路径时,它无法找到该文件。我认为我更接近使用上述解决方案,react-native-fs因为文件下载并且可以定位,但我可能完全错了。任何意见或建议将不胜感激。

4

1 回答 1

0

想通了,张贴以防万一这对其他人有用...如果您在android上尝试下载然后打开一个文件,它会打开空白,您很可能没有权限。这与您使用哪种文件查看和下载工具无关。https://github.com/joltup/rn-fetch-blob/issues/483#issuecomment-761763626

我使用的解决方案:

RNFS.downloadFile(options)
  .promise.then(()=> PermissionsAndroid.requestMultiple([
    PermissionsAndroid.PERMISSIONS.READ_EXTERNAL_STORAGE,
    PermissionsAndroid.PERMISSIONS.WRITE_EXTERNAL_STORAGE,
  ]))
  .then((result) => {
    const isGranted = result[PermissionsAndroid.PERMISSIONS.READ_EXTERNAL_STORAGE] === 'granted' 
    && result[PermissionsAndroid.PERMISSIONS.WRITE_EXTERNAL_STORAGE] === 'granted';

    isGranted ? FileViewer.open(filePath, {showOpenWithDialog: true, showAppsSuggestions: true}) : console.log('Declined')})
  .then(() => {
    console.log('File should have opened');
  })
于 2021-07-23T13:18:24.347 回答