React-Native 0.63 无法访问 Android 10 中的设备存储图像

Question

我正在使用 React Native 0.63。我想从我的 phone 的设备存储中在 FlatList 中显示图像，并使用 <Image/> 作为 FlatList 的 renderItem 道具。使用 source 道具，我添加了一个 uri 键，但我仍然看不到图像。图像块正在 FlatList 中生成，当我尝试滚动列表时，我能够在右侧看到细滚动条。

这就是我正在做的显示图像的操作。（这里使用的 uri 是我从 CameraRoll.getPhotos() API 获得的图像）

<Image
 source={{ uri: 'file:///storage/emulated/0/Pictures/Twitter/20201019_160855.jpg'}}
 style={{ height: 100, width: 100 }}
/>

我已确定以下内容：

允许应用程序 READ_EXTERNAL_STORAGE 和 WRITE_EXTERNAL_STORAGE 权限。
为文件添加了 file:// 前缀。
确保 <Image/> 中的 source={{ uri: ... }} 适用于外部链接，尝试使用 Google 徽标，来自互联网的随机 jpeg。

我注意到的另一件事是，我在遇到此问题的设备上使用带有 Android 10 的三星 phone。我在 Google Nexus 5 Android 模拟器上尝试了运行这个，它也在 Android 10 上运行并且工作得很好（通过这个，我的意思是我能够访问模拟器的设备存储，而不是使用上面指定的完全相同的 uri）。

更新： 尝试在 Android 7 上编译应用程序，上面的东西工作正常。 SDK 版本有任何问题吗？

Answer 1

模拟器上显示的图像是否正确？

如果问题仅出在您的设备上，您需要检查是否已添加 android.permission.READ_EXTERNAL_STORAGE 到您的 AndroidManifest.xml 并请求权限使用文件存储

参见：Usage - react-native CameraRoll

Answer 2

您是否遇到权限被拒绝的错误？

这可能会有所帮助： https://github.com/react-native-image-picker/react-native-image-picker/issues/1259

要尝试添加的内容：

android:requestLegacyExternalStorage="true"

...到您 AndroidManifest.xml.

中的标签

警告：

2021 年 5 月 5 日起： Play 商店不会接受此实现 并删除所有使用它的应用程序，除非该应用程序在功能上确实需要它并且需要请求它。

实现需要使用分区存储。

Answer 3

This can be helpful: https://github.com/react-native-image-picker/react-native-image-picker/issues/1259

In manifest
 android:requestLegacyExternalStorage="true"
  
 <application
      android:name=".MainApplication"
      android:label="@string/app_name"
      android:icon="@mipmap/ic_launcher"
      android:allowBackup="true"
      android:theme="@style/AppTheme"
      android:requestLegacyExternalStorage="true"
        android:usesCleartextTraffic="true"> 


  build.gradle

 // camera    
    compileSdkVersion = 29

React-Native 0.63 无法访问 Android 10 中的设备存储图像

React-Native 0.63 not able to access Device Storage images in Android 10

android

image

android-emulator

react-native