philipphecht / react-native-doc-viewer

React Native Doc Viewer (Supports file formats: xls,ppt,doc,xlsx,pptx,csv,docx,png,jpg,pdf,xml,binary ...)

Hi there 👋 I'm Philipp H.

About Me

I'm philipphecht, a ** Cloud/Software/Blockchain Architect ** living on this beautiful Earth.

Languages and Tools

Stats

react-native-doc-viewer's Issues

Android Quicklook support without an external application?

Is it supported in current version? If not can you please share tentative timeline of the availability

OpenFile.openDocb64 not working in android

Android Support for Video file open

Need to open video file using this library in android

OpenFile is undefined on Android

Versions in use

react-native: 0.48.3,
react-native-doc-viewer: 2.4.7,

Bug description

Everything works fine on iOS.
I tried both auto linking and manual install for Android, but in either case, OpenFile is undefined.

Relevant code

import OpenFile from 'react-native-doc-viewer';

OpenFile.openDocBinaryinUrl([{
    url:"http://mail.hartl-haus.at/uploads/tx_hhhouses/{binaryString}",
    fileName:"sample",
    fileType:"jpg"
}], (error, url) => {
    if (error) {
        console.error(error);
    } else {
        console.log(url)
    }
});

Error message

undefined is not a function (evaluating '_reactNativeDocViewer2.default.openDocBinaryinUrl')

Also, the example application keeps crashing, so I can't test with that.

Thanks in advance!

Activity not found to handle: content://com.reactlibrary.provider/name/xxxx.pdf (application/pdf)

simulator

genymotion - Sony Xperia Tablet Z - 4.2.2 api 17

usage

OpenFile.openDoc([{
                url: `a url return pdf binary byte`,
                fileName:  '',
                fileType: 'pdf',
            }], (error, url) => {
                if (error) {
                    console.error(error);
                } else {
                    console.log(url)
                }
            })

open mp4 show error!!! Path determination is not a problem


[Suggestion]Add .npmignore

Your npm package is too large.
Try ignore any useless files and directories using .npmignore.

Android app crashes after updating RN to 0.45

I updated RN 0.45.0 and after that the app crashes as soon as I try to open any file. I found that If I change my targetSdkVersion to 23 (instead of 25) it doesn't crash, but instead tells me that "Media not found".

Any solution?

Could not find org.docx4j:3.3.3:

Works perfectly on iOS, but on android I get Could not find org.docx4j:3.3.3

Plz support [email protected]

i want to support [email protected]

Windows Support?

Is it supported in current version? If not can you please share tentative timeline of the availability

INSTALL_FAILED_CONFLICTING_PROVIDER issue

hi,
i created two different app and install same device with this lib. But when i try to install second app i get this error.

• What went wrong:
  Execution failed for task ':app:installDebug'.

com.android.builder.testing.api.DeviceException: com.android.ddmlib.InstallException:
Failed to finalize session : INSTALL_FAILED_CONFLICTING_PROVIDER: Package couldn't be installed in /data/app/com.example.first-1:
Can't install because provider name com.reactlibrary.provider (in package com.example.first) is already used by com.example

必须rn 0.45才能使用吗？在0.42是否可以使用该组件呢？

I want to open pdf,doc,excel..under react-native 0.42,？is it useful

android doc open error!!

handlePress = () => {
   OpenFile.openDoc([{
     url:"http://xxxxxx/201709/1504839653822.docx",
     fileName:"sample",
      fileType: 'docx',
   }], (error, url) => {
      if (error) {
        console.error(error);
      } else {
        console.log(url)
      }
    })
  }

is as the same use QuickLook in iOS native？

is as the same use QuickLook in iOS native？

Done button action

is there a way to have a callback function being executed when the "Done" button is pressed

how to open the doc in a view container

I want to open it in a view container, not full screen, how can i do it

"Failed to find configured root" - Android Error

Hi,
I am working on React Native 0.44 version and checking in device runnning on Android KitKat.
I am getting the below Error.This is what i am using in my code,
React Native Doc Viewer version : 2.4.7
Is it a bug or am I doing anything wrong ?

_openDocViewer(fileURL,filename){
      console.log("OpeningDoc : "+fileURL);
      OpenFile.openDoc([{
           url: fileURL,
           fileName : filename
         }], (error, url) => {
            if (error) {
              console.log(error);
            } else {
              console.log(url)
            }
          });
  }

  _handleFilePress(fileURL){
    const filename = fileURL.substring(fileURL.lastIndexOf('/')+1);
    var filePath = RNFS.DocumentDirectoryPath+"/" ;
    RNFS.exists(filePath+filename).then((fileExists) => {
            console.log(fileExists);
            if (fileExists) {
                filePath = (Platform.OS === 'ios') ? filePath : "file://"+filePath;
                this._openDocViewer(filePath+filename,filename);
            } else {
                console.log("Downloading File");
                RNFS.downloadFile({fromUrl:fileURL, toFile: filePath+filename}).promise.then(res => {
                  filePath = (Platform.OS === 'ios') ? filePath : "file://"+filePath;
                  this._openDocViewer(filePath+filename,filename);
                }).catch(err => {
                    console.log("downloadFileTest error: ", err)
                });
            }
    });
  }

java.lang.IllegalArgumentException: Failed to find configured root that contains /data/data/com.weconnect/files/July18_SMDiscussion.doc
                                                                 at android.support.v4.content.FileProvider$SimplePathStrategy.getUriForFile(FileProvider.java:711)
                                                                 at android.support.v4.content.FileProvider.getUriForFile(FileProvider.java:400)
                                                                 at com.reactlibrary.RNReactNativeDocViewerModule$FileDownloaderAsyncTask.onPostExecute(RNReactNativeDocViewerModule.java:234)
                                                                 at com.reactlibrary.RNReactNativeDocViewerModule$FileDownloaderAsyncTask.onPostExecute(RNReactNativeDocViewerModule.java:196)
                                                                 at android.os.AsyncTask.finish(AsyncTask.java:632)
                                                                 at android.os.AsyncTask.access$600(AsyncTask.java:177)
                                                                 at android.os.AsyncTask$InternalHandler.handleMessage(AsyncTask.java:645)
                                                                 at android.os.Handler.dispatchMessage(Handler.java:102)
                                                                 at android.os.Looper.loop(Looper.java:136)
                                                                 at android.app.ActivityThread.main(ActivityThread.java:5001)
                                                                 at java.lang.reflect.Method.invokeNative(Native Method)
                                                                 at java.lang.reflect.Method.invoke(Method.java:515)
                                                                 at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:785)
                                                                 at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:601)
                                                                 at dalvik.system.NativeStart.main(Native Method)

Android build failed - Illeagal escape character \.

:react-native-doc-viewer:compileReleaseJavaWithJavac - is not incremental (e.g. outputs have changed, no previous execution, etc.).
/Users/arunprasad/Repos/test12-app/node_modules/react-native-doc-viewer/android/src/main/java/com/reactlibrary/RNReactNativeDocViewerModule.java:122: error: illegal escape character
            if (fileName.indexOf("\.") == -1){
                                   ^
1 error
:react-native-doc-viewer:compileReleaseJavaWithJavac FAILED

FAILURE: Build failed with an exception.

* What went wrong:
Execution failed for task ':react-native-doc-viewer:compileReleaseJavaWithJavac'.
> Compilation failed; see the compiler error output for details.

* Try:
Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output.

BUILD FAILED

"react-native": "0.48.2"
"react": "16.0.0-alpha.12"

Done button language

How can i change done button language ?

How to open a file in the project?

How can I open a file in the path "../app/Resources/Pdfs/test.pdf" ?

ClassCastException: com.reactlibrary.RNReactNativeDocViewerPackage cannot be cast to java.util.List

Hi, I have configured using gradle. Everything is Ok. When i try to override getPackages() method it shows ClassCastingException. This is my getPackages methods definition

@OverRide
protected List getPackages() {
return new RNReactNativeDocViewerPackage();
}

This is my error --->

java.lang.RuntimeException: Unable to start activity ComponentInfo{math.anubvam.com.alldocsviewer/math.anubvam.com.alldocsviewer.MainActivity}: java.lang.ClassCastException: com.reactlibrary.RNReactNativeDocViewerPackage cannot be cast to java.util.List

[Android]Can't open.

Error logs:

03-21 13:34:23.256 7011-7011/com.zangku.zangku I/System.out: Mime Type: application/pdf
03-21 13:34:23.259 7011-7011/com.zangku.zangku W/System.err: android.content.ActivityNotFoundException: No Activity found to handle Intent { act=android.intent.action.VIEW dat=file:///data/user/0/com.zangku.zangku/cache/zangku_files/2dbe0a09826b4e3c97df1f873717f3c0/ios.pdf typ=application/pdf flg=0x10000000 }
03-21 13:34:23.259 7011-7011/com.zangku.zangku W/System.err: at android.app.Instrumentation.checkStartActivityResult(Instrumentation.java:1798)
03-21 13:34:23.259 7011-7011/com.zangku.zangku W/System.err: at android.app.Instrumentation.execStartActivity(Instrumentation.java:1512)
03-21 13:34:23.259 7011-7011/com.zangku.zangku W/System.err: at android.app.ContextImpl.startActivity(ContextImpl.java:677)
03-21 13:34:23.259 7011-7011/com.zangku.zangku W/System.err: at android.app.ContextImpl.startActivity(ContextImpl.java:659)
03-21 13:34:23.259 7011-7011/com.zangku.zangku W/System.err: at android.content.ContextWrapper.startActivity(ContextWrapper.java:331)
03-21 13:34:23.259 7011-7011/com.zangku.zangku W/System.err: at com.reactlibrary.RNReactNativeDocViewerModule$FileDownloaderAsyncTask.onPostExecute(RNReactNativeDocViewerModule.java:207)
03-21 13:34:23.259 7011-7011/com.zangku.zangku W/System.err: at com.reactlibrary.RNReactNativeDocViewerModule$FileDownloaderAsyncTask.onPostExecute(RNReactNativeDocViewerModule.java:164)
03-21 13:34:23.259 7011-7011/com.zangku.zangku W/System.err: at android.os.AsyncTask.finish(AsyncTask.java:651)
03-21 13:34:23.259 7011-7011/com.zangku.zangku W/System.err: at android.os.AsyncTask.-wrap1(AsyncTask.java)
03-21 13:34:23.259 7011-7011/com.zangku.zangku W/System.err: at android.os.AsyncTask$InternalHandler.handleMessage(AsyncTask.java:668)
03-21 13:34:23.259 7011-7011/com.zangku.zangku W/System.err: at android.os.Handler.dispatchMessage(Handler.java:102)
03-21 13:34:23.259 7011-7011/com.zangku.zangku W/System.err: at android.os.Looper.loop(Looper.java:148)
03-21 13:34:23.259 7011-7011/com.zangku.zangku W/System.err: at android.app.ActivityThread.main(ActivityThread.java:5417)
03-21 13:34:23.259 7011-7011/com.zangku.zangku W/System.err: at java.lang.reflect.Method.invoke(Native Method)
03-21 13:34:23.259 7011-7011/com.zangku.zangku W/System.err: at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:726)
03-21 13:34:23.259 7011-7011/com.zangku.zangku W/System.err: at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:616)

Library Issue

Hello,

I recently downloaded your project but i'm not having any libraries in the project. So can you please help me how to get those libraries and libRNReactNativeDocViewer.a file.

Kindly please update me asap. Waiting for your response.

Set title for window

How can I set the title as a param passed in?

SyntaxError: import declarations may only appear at top level of a module

Hi
I'm trying to use react-native-doc-viewer on react web application with visual studio.
I saw the tuto, but I don't understand , I have this error :

      SyntaxError: import declarations may only appear at top level of a module

This is my code :
import OpenFile from 'react-native-doc-viewer';

handlePress = () => {
    OpenFile.openDoc([{
        url:"http://www.snee.com/xml/xslt/sample.doc",
        fileName:"sample"
   }], (error, url) => {
      if (error) {
        console.error(error);
      } else {
        console.log(url)
      }
    })
}

<div id="documentViewer">
         {this.handlePress}
</div>

How can I do that ? Thank you

Android crash - error couldn't find key cache in dynamic object

Hi
Im getting an error while trying to open docs (www) throw android,
Error says error couldn't find key cache in dynamic object
you can see it with the readme example of openDo method

Add an open source license?

Thanks for sharing this project! We'd love to use it as part of the Mattermost open source project (https://www.mattermost.org/) in our React Native mobile app (which users an Apache 2.0 license).

Would you consider adding either an MIT or an Apache 2.0 license?

To do so, in GitHub you can hit "Create new file" and name a file LICENSE.txt

This will prompt GitHub to offer a license template:

If you use either an MIT license or an Apache 2.0 license it would make it easy to add your work to other open source projects, and we'd love to include your work in ours.

Thanks kindly for your consideration.

IOS和安卓文件路径不一样

安卓需要加file://，IOS不需要。这点最奇葩的是在模拟器上和在真机上还不一样。

Recent PRs broke the Android build

What needs to be changed in RNReactNativeDocViewerModule.java. I'd open a PR, but am extremely busy in the next couple of days...

1. if (fileName.indexOf("\.") == -1) should be if (fileName.indexOf("\\.") == -1){

private final String url;
private final String fileName; 

to

private final String url;
private final String fileName;
private final Boolean cache; 

this.callback = callback;
this.url = url;
this.fileName = fileName; 

to

this.callback = callback;
this.url = url;
this.fileName = fileName;
this.cache = cache; 

Support lazy loading

Hi, @philipphecht!

I have just tried your plugin and it looks/works pretty well. But, it takes too much time to load big PDF files. What do you think about lazy loading (for doc and for its pages)?
I mean:

1. Open viewer instantly and show some loading bar, while document downloading is in progress
2. When you know the total number of pages - render all of them with spinners, so user will be already able to scroll document down and not just wait for smth
3. When a page ready (parsed or what), replace spinner with page content
   You can find an example of that behaviour here: https://mozilla.github.io/pdf.js/web/viewer.html
   Are you going to implement this? And when, if so? :)

BTW: Great job! Viewer with already loaded (but takes muck time) document works really good!

What's the api when i click 'done' button in preview sence?

What's the api when i click 'done' button in preview sence?

Use headers for authenthication

Is there any way to pass in headers or api keys?

How to read excel file

I just found your project in morning. It's pretty promise but I need more instruction how to use

console.error: 1

In android i had this error when try to open a local file.

handlePress = () => { OpenFile.openDoc([{ url:"/Users/iosdev/Desktop/readers/react-native-doc-viewer-master/example/DocViewerExample/ios/ACOXXEL_FICHA_TECNICA.pdf" }], (error, url) => { if (error) { console.error(error); } else { console.log(url) } }) }

user OpenFile.openDoc download file will delete in a week later

i use OpenFile.openDoc api to open file, in a week later, reopen file , it's lost.

Content Provider issue

Hi guys, noticed since the 2.4.6 update you cannot have different flavors of the same app installed one device due to conflicting com.reactlibrary.provider settings from your module.

Would be great if you supported applicationIdSuffix or something of the kind to prevent this issue.

To reproduce the issue:

• install app with id com.yourapp.dev
• try install app with id com.yourapp.prod and it will fail

Will this module support CSV file?

This is an awesome module!
Could you put the support for CSV file on the roadmap?

Many thanks.

Cannot read property 'openDoc' of undefined

I installed the package, linked everything in xCode, but when I put in
import OpenFile from 'react-native-doc-viewer';
I get the following error,
"Cannot read property 'openDoc' of undefined".

Any ideas?

Progress callback?

So I have this setup using NativeBase's ListItem component and onPress it shows the file using OpenFile.openDocBinaryinUrl... Before this is called, I set a flag in state to indicate download has started and when the download completes, the 2nd param callback handler in OpenFile.openDocBinaryinUrl is called and I reset the flag in state to hide the spinner. This all works ok for me...

However, it would be nice to know download progress for large files? Like iCloud images have a circular progress pie chart indicator.

Do you think it would be possible to have either an event based callback or a timed one that tells the amount downloaded and file size so we can render progress bars?

Unable to access local files (Android)

Hi I tried to open local files using android emulator but I'am getting an error stating 1.
I have tried it for PDF,JPG,PNG and XLSX types and I got the same result.

The app works fine in case of IOS.

When do you intend to release the same for windows?

Save image crashed app

when i try to save an image in IOS app crashed with SIGABRT code.

BACKGROUND THREAD 13 - CRASHED
0 libsystem_kernel.dylib __abort_with_payload
1 libsystem_kernel.dylib abort_with_payload
2 TCC CRASHING_DUE_TO_PRIVACY_VIOLATION
3 TCC __TCCAccessRequest_block_invoke.73
4 TCC __tccd_send_block_invoke
5 libxpc.dylib _xpc_connection_reply_callout
6 libxpc.dylib _xpc_connection_call_reply
7 libdispatch.dylib _dispatch_client_callout
8 libdispatch.dylib _dispatch_queue_override_invoke
9 libdispatch.dylib _dispatch_root_queue_drain
10 libdispatch.dylib _dispatch_worker_thread3
11 libsystem_pthread.dylib _pthread_wqthread
12 libsystem_pthread.dylib start_wqthread

No Activity found to handle Intent

No Activity found to handle Intent { act=android.intent.action.VIEW dat=file:///data/data/com.rndf/cache/PP_-588362804.pdf typ=application/pdf flg=0x10000000 }

Dont show document

When I try to view the document from the internet, the url is displayed in console but does not load the document on screen and this message also appears in console "DATA nil"

When i use with image base 62 it works great

Crash on Android

Hi,

When I invoke OpenFile.openDoc, my app crashes with the following error:

"android.util.AndroidRuntimeException: Calling startActivity() from outside of an Activity context requires the FLAG_ACTIVITY_NEW_TASK flag. Is this really what you want?"

I browsed the source code for android and I see the flag being set on the Intent.
What am I missing here?

I am running on an Android Emulator btw.

undefined is not an object (evaluating 'RNReactiveNativeDocViewer.openDoc')

Hi there. Any help on this would be so great! Thank you in advance.

Problem

• My app blows up when I am importing OpenFile into my app

Background

• My app is a recently ejected app from Expo. It worked after it ejected, but the issue came about after installing this plugin

I have:

• Installed the package
• Ran all of the necessary updates
• Ran react-native link
• Ran pod install

When I run my app, I get:

Issue opening XLSX file.

This plugin is working fine for Images and PDFs on our API which runs on /attachment/:id (where ID is numeric).

  _renderAttachment(attachment) {
    const baseUrl = Config.BASE_URL;

    return (
      <ListItem key={attachment.id} onPress={() => OpenFile.openDoc([{url: baseUrl + attachment.download_url, fileName: attachment.file_name}], (error, url) => { if (error) { console.error(error) } }) } >
        <Body style={styles.listItemBody}>
          <Text>{attachment.file_name}</Text>
        </Body>
        <Right><Icon name="arrow-forward" /></Right>
      </ListItem>
    );
  }

I have tried adding fileType:'xls' and fileType:'xlsx' to the openDoc params. No effect.

I am testing out with this file:
https://tcd.blackboard.com/webapps/dur-browserCheck-BBLEARN/samples/sample.xlsx

(comes top of Google for "xlsx example" 😉 )

The attachment object looks like this:

{
  content_disposition:"attachment",
  created_at:"2017-07-06T17:09:39.076Z",
  download_url:"/attachments/11",
  file_name:"sample.xlsx",
  id:11,
  mime_type:"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
}

how to use with base64

I like much the component but i not work with base64

have any way to work with base64?

"Couldn't issue file extension for path" for every file i'm trying to open

Hi,

currently i have a problem with opening anything with react-native-doc-viewer.

I'm trying to pick a file from iCloud, ending up with following data:

[ { url: 'file:///private/var/mobile/Containers/Data/Application/3B8B66C1-F991-4357-9D3B-B740B50039A8/tmp/org.my.app-Inbox/HELP%20resume%20-%20tanner.pdf',
    fileName: 'HELP resume - tanner.pdf' } ]

so i'm passing url like so:

OpenFile.openDoc(
  [
    {
      url: url.uri,
      fileName: url.fileName,
    },
  ],
  (error, url) => {
    if (error) {
      console.error(error);
    } else {
      console.log(url);
    }
  },
);

Sadly, everything i'm trying to preview ends up with gray preview view and following log:

2017-05-14 19:01:05.642140+0200 CommunityClient[380:36929] [default] Couldn't issue file extension for path: /file:/private/var/mobile/Containers/Data/Application/3B8B66C1-F991-4357-9D3B-B740B50039A8/tmp/org.my.app-Inbox/HELP%20resume%20-%20tanner.pdf #PreviewItem

How to change the file name in the top header?

How to change the file name in the top header?
I used render file "url: file://${url}
and tried with field fileNameOptional and fileName but it not works.