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 ?Roshan Gautam– Roshan Gautam2018-12-14 09:28:11 +00:00Commented Dec 14, 2018 at 9:28
-
I'm getting file source (b64) from the apiMazMat– MazMat2018-12-14 09:43:00 +00:00Commented 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.Roshan Gautam– Roshan Gautam2018-12-14 09:50:51 +00:00Commented 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 docsMazMat– MazMat2018-12-14 09:52:57 +00:00Commented Dec 14, 2018 at 9:52
Add a comment
|
4 Answers
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 Comments
Jain Nidhi
can you share full code that list all pdf viewer application?
Narendra Singh
But, its not working for Android 10. Unable to open the file in Android 10 using
android.actionViewIntent(path, 'application/pdf');. :(
Javascript Hupp Technologies
@NarendraSingh Check this solution for android github.com/joltup/rn-fetch-blob/pull/317#issuecomment-492635523 However it opens but also close automatically in seconds don't know why.
HyopeR
@NarendraSingh You can fix this by adding a few things to AndroidManifest.xml. Check the link. github.com/joltup/rn-fetch-blob/issues/749
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:
Let me know here, how it goes. If this solves your problem, give a upvote. :D)
6 Comments
mXX
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
Oliver D
I got Could not open URL
'file:///storage/emulated/0/prophet_app/File0.pdf'
dsicari
Thanks!! I just imported Linking and use as
onPress={()=>Linking.openURL("https://xx/xx.pdf")}
Suyash Vashishtha
Thanks man !.. Totally worked like a charm with no extra modules.
Abdur Rahman
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()
|
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"
Comments
The Easy way to load remote PDF,try this
Linking.openURL(url).catch((err) => {
console.log(err)
})