CODEWITHSUNDEEP
react-native
MazMat
MazMat

Reputation: 2094

How to open pdf files in 3rd party app via React Native?

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?

Upvotes: 4

Views: 26335

Answers (4)

Manoj Alwis
Manoj Alwis

Reputation: 1426

The Easy way to load remote PDF,try this

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

Upvotes: 3

angelos_lex
angelos_lex

Reputation: 1661

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"

Upvotes: 4

JanithaR
JanithaR

Reputation: 1132

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);

Upvotes: 9

Roshan Gautam
Roshan Gautam

Reputation: 510

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)

Upvotes: 4

Related Questions