0

I setup ngx-doc-viewer to preview various file types using url, and while it works for pdfs, jpegs, and everything else I've tried, excel files just seem to not preview anything(it doesn't say "no preview available" like I've ran into before) and instead it downloads the file as well.

It isn't a file size issue as I've tried it with near empty spreadsheets. Any reason why this would be?

My plan is to use google over url, but I am using url so that I can see my previews in local

Here is my code

<ngx-doc-viewer
   [url]="fileName"
   viewer="url"
   style="width:100%;height:70vh;"
></ngx-doc-viewer>
J64
  • 74
  • 1
  • 2
  • 10

1 Answers1

2

from the package's documentation: https://www.npmjs.com/package/ngx-doc-viewer

Documents that are publicly available can be shown in an iframe using the google or office document viewer.

passing a publicly available url is the only way to preview a xlsx file.

a Iframe it's just another website embedded in your application, in this case it's using google's and office's own websites to display the previews. since the iframe cannot authenticate the user and check If you have permission to view the document, it has to be public.

this also mean that you can't load a file from your own computer to preview it.

EDIT: I managed to preview a xlsx file by uploading it to firebase and getting the link. I also saw other people saying that they managed to display it by uploading the file to AWS Cloud Storage. If this is a option to you then maybe it's worth a try, you would first upload the file to some online cloud storage and then grab the public link to display it. otherwise the original post bellow stands.

If you only want to show a static file in your application:
upload it to google drive or office, make it public and grab the link to display it.

If you need the preview to be uploaded by the user as I assume it's what you are trying to do, there's no other way besides reading the xlsx file and parsing the data to display in your html.

for that you can use the XLSX package: https://www.npmjs.com/package/xlsx

Daniel
  • 63
  • 6