1

I would appreciate any help on this. I'm using react-native-camera and when I get the URI of the image taken using takePictureAsync() method, I can't access that image.

I took the photo and navigate to the next screen, passing the image data as the params:

  const data = await this.camera.takePictureAsync(options);
  console.log(data);
  this.props.navigation.navigate('FFV', {
    postItem: data.uri
  });

In the next screen (FFV) I am loading the photo into <Image/> ,it works if I pass the base64 of the image, but doesn't work if I just pass the URI.

<Image style={styles.imagePreview}
          source={{ isStatic:true, uri: postItem }}
          resizeMode="contain"
 />

The image doesn't render and if I try to save the file using CameraRoll, I get "No such file or directory".

First the image data is printed out, second is the error accessing the file

I've tested on the emulator and on physical device - same problem. It doesn't seem to be related to WRITE_EXTERNAL_STORAGE permission, because after I granted the permissions, the ENOENT error occurs.

I check the cache of the app on the phone, and it doesn't have those files, does it mean it's not writing it? If there were issues with the RNCamera I would think the URI wouldn't be returned successfully.

"react-native": "0.57.1",
"react-native-camera": "^1.3.0",

Any help would be much appreciated!

Firdous nath
  • 1,487
  • 1
  • 14
  • 38
John Henry
  • 183
  • 3
  • 10

2 Answers2

1

I encountered the same problem and end up by using this CameraRoll.saveToCameraRoll(data.uri).

rolz
  • 80
  • 1
  • 6
  • Thanks, will give it a try and let you know. – John Henry Jan 25 '19 at 10:36
  • I'd love to know if anyone has come up with a way around this without saving to the camera roll. I'd like to avoid filling up the user's camera roll if possible. – Murphy Randle Jun 16 '19 at 00:00
  • @MurphyRandle did you get anything? – JustABeginner Oct 21 '19 at 08:25
  • @JustABeginner I wish I remembered! But I think I was able to use expo-camera ('cause I was using Expo), get the temp URI they return after taking a picture, copy the image to a permanent location using the file APIs, and then I was good to go. – Murphy Randle Oct 21 '19 at 19:06
0

You should remove any file:// prefix of the file, e.g.:

    const uri = data.uri.startsWith('file://')
              ? data.uri.substr('file://'.length)
              : data.uri;
Bjørn Egil
  • 2,398
  • 1
  • 20
  • 22