3

I don't want to use RN libraries to create a pdf viewer, I'd like to click on a file icon and be asked in which installed application would I like to open the file.

Is there any library that allows me that?

4
  • Are you looking to open local pdf files or files hosted online somewhere in the internet ? Dec 14, 2018 at 9:28
  • I'm getting file source (b64) from the api
    – MazMat
    Dec 14, 2018 at 9:43
  • I think react-native-view-pdf allows you to open pdf in Base64 format as well. I have included the link in the answer below. Dec 14, 2018 at 9:50
  • But this library wont allow me to pick a 3rd party app to display the pdf file in, unless I am misunderstanding the docs
    – MazMat
    Dec 14, 2018 at 9:52

4 Answers 4

8

I have used rn-fetch-blob in my project. After that, it's easy as doing;

Android

const android = RNFetchBlob.android;
android.actionViewIntent(path, 'application/pdf');

iOS

RNFetchBlob.ios.openDocument(path);
4
4

Probably, you can use Linking from react native itself in order to open pdf files such as:

Linking.openURL(url).catch((err) => {
      console.log(err)
});

If url is local, you might wanna use something similar to:

import RNFS from 'react-native-fs';

file://${RNFS.DocumentDirectoryPath}/file.pdf.

Or if online, url can be:

http://www.example.com/file.pdf

You can also try using this package available:

react-native-view-pdf

Let me know here, how it goes. If this solves your problem, give a upvote. :D)

5
  • 1
    I am using RNFS and doing the Linking in the format you are showing, but it's showing me an error like Error: Unable to open URL: file:///var/mobile/Containers/Data/Application/F842ED12-DDAD-4890-B6CA-66F7EBE460A2/Documents/picture1.jpg
    – mXX
    Jan 22, 2020 at 13:22
  • I got Could not open URL 'file:///storage/emulated/0/prophet_app/File0.pdf'
    – Oliver D
    Jan 25, 2020 at 11:49
  • Thanks!! I just imported Linking and use as onPress={()=>Linking.openURL("https://xx/xx.pdf")}
    – dsicari
    Jan 9, 2021 at 2:20
  • Thanks man !.. Totally worked like a charm with no extra modules. Feb 11, 2022 at 8:55
  • Got this error: Could not open URL 'file:///storage/emulated/0/Download/q.jpg': file:///storage/emulated/0/Download/q.jpg exposed beyond app through Intent.getData() Feb 8 at 11:56
3

I could not make it work with Linking for local pdf files. Then i searched more and found react-native-file-viewer. With this, you can open a pdf as simply as:

 import FileViewer from "react-native-file-viewer";
 ... 


 try {
     await FileViewer.open(url, { showOpenWithDialog: true, showAppsSuggestions: true });
 } catch (e) {
     console.warn(TAG, "An error occurred", JSON.stringify(e));
 }

Note: The uri passed to the open function is doesn't need any file:// prefix. Just the normal path, like RNFS.ExternalStorageDirectoryPath + "/mypdf.pdf"

0
1

The Easy way to load remote PDF,try this

Linking.openURL(url).catch((err) => {
  console.log(err)
})

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.