Whenever we pick up a document on an Android device from the document picker, it returns us a URI something like content:///

Where is the content provider authority of the selected file and is the file path relative to the content provider’s root directory.
Which is not a valid link if you use it to send over the API, for example, when you are uploading a file on Firebase Storage.

To overcome this problem, we can use the copyTo: ‘documentDirectory’ option in the DocumentPicker. It will copy the selected file into the app’s document directory and return a URI pointing to the copied file in the document directory.

Here is how to achieve this:

let documents = await DocumentPicker.pickMultiple({
        type: DocumentPicker.types.allFiles, //You can mention all the file types required here
        copyTo: 'documentDirectory',
      });

documents = documents.map(doc => ({
        ...item,
        fileCopyUri: `file://${decodeURIComponent(doc.fileCopyUri)}`,
      }));

Using the above code snippet, the URI which gets returned will look something like

file://<path>

Where will be the path of the copied file in your app’s document directory.

The fileCopyUri property is created by appending `file://` before the copied file uri so it can have a format like

file://<path>

The decodeURIComponent function will decode any URI-encoded characters in the URI such as spaces or non-ASCII characters.

For More Information: React Native Document Picker