How to get Absolute path of a file in react-native?

I actually figured this out myself. You can get Absolute path in 3 ways.

The most convenient way : Use react-native-document-picker, on selection it will give you a Relative path, something like this content://com.android....... Pass that Relative path to Stat(filepath) function of the react-native-fetch-blob library. The object will return absolute path. Append the path with file:// to use it for further operations.

The other 2 ways are by using react-native-image picker and CameraRoll (React Native Library)

I hope this helps !

Edit: Please make sure you run the app on hardware device rather than Virtual Device to test it.


Install react-native-fetch-blob to get the path of the file. Below is an example.

pickFile = async () => {
try {
  const res = await DocumentPicker.pick({
    type: [DocumentPicker.types.allFiles],
  });

  console.log(res.uri);
  //output: content://com.android.providers.media.documents/document/image%3A4055

  RNFetchBlob.fs
    .stat(res.uri)
    .then((stats) => {
      console.log(stats.path);
 //output: /storage/emulated/0/WhatsApp/Media/WhatsApp Images/IMG-20200831-WA0019.jpg
    })
    .catch((err) => {
      console.log(err);
    });
} catch (err) {
  if (DocumentPicker.isCancel(err)) {
  } else {
    throw err;
  }
}};