2
votes

React-Native 0.63 ne peut pas accéder aux images de stockage de l'appareil dans Android 10

J'utilise React Native 0.63. Je voulais afficher des images dans une FlatList à partir du stockage de l'appareil de mon téléphone et renderItem <Image/> pour le prop renderItem de FlatList. En utilisant l'accessoire source , j'ai ajouté une clé uri mais je ne suis toujours pas en mesure de voir les images. Les tuiles d'image sont générées dans la FlatList et je peux voir la fine barre de défilement sur la droite lorsque j'essaye de faire défiler la liste.

C'est ce que je fais pour afficher l'image. (L' uri utilisé ici est une image que j'ai obtenue de l'API CameraRoll.getPhotos() )

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

Je me suis assuré de ce qui suit:

  1. Autorisations READ_EXTERNAL_STORAGE et WRITE_EXTERNAL_STORAGE autorisées pour l'application.
  2. Ajout file:// préfixe file:// au fichier.
  3. Assurez-vous que source={{ uri: ... }} dans <Image/> fonctionne pour les liens externes, a essayé d'utiliser le logo Google, des jpeg aléatoires provenant d'Internet.

Une autre chose que j'ai remarquée est que j'utilise un téléphone Samsung avec Android 10 sur mon appareil où je suis confronté à ce problème. J'ai essayé de l'exécuter sur l'émulateur Android Google Nexus 5 qui fonctionne également sur Android 10 et fonctionne parfaitement (par cela, je veux dire que je suis capable d'accéder au stockage de l'appareil de l'émulateur sans utiliser exactement le même uri spécifié ci-dessus).

MISE À JOUR: J'ai essayé de compiler l'application sur Android 7, la chose ci-dessus fonctionne bien. Un problème avec les versions du SDK?


0 commentaires

3 Réponses :


0
votes

Les images s'affichent-elles correctement sur l'émulateur?

Si le problème concerne uniquement votre appareil, vous voudrez vérifier que vous avez ajouté android.permission.READ_EXTERNAL_STORAGE à votre AndroidManifest.xml et avez demandé l'autorisation d'utiliser le stockage de fichiers.

Voir: Utilisation - CameraRoll native de réaction


1 commentaires

1. Oui, les images s'affichent correctement sur l'émulateur. 2. J'ai ajouté des autorisations de lecture et d'écriture sur le stockage externe et sont activées dans la section Informations sur l'application.



3
votes

Obtenez-vous une erreur d'autorisation refusée?

Cela pourrait être utile: https://github.com/react-native-image-picker/react-native-image-picker/issues/1259

Quelque chose à essayer d'ajouter:

android:requestLegacyExternalStorage="true"

... à la balise dans votre AndroidManifest.xml.


2 commentaires

Oui, ajouter cela a fonctionné. De plus, vous devez apporter une autre modification.Dans le fichier build.gradlew du projet, vous devez modifier votre compileSdkVersion en 29.


En ajoutant au commentaire ci-dessus, il n'y a pas d'erreur de refus d'autorisation. Il s'agit principalement d'un problème pour Android 10, vous devez ajouter android:requestLegacyExternalStorage="true" pour accéder au stockage externe.



0
votes
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 

0 commentaires