Inline pdf previews

This is a desktop-only theme component that will allow you to create previews for pdf attachments.

Repository link
https://github.com/discourse-com/discourse-pdf-previews

Preview:
https://theme-creator.discourse.org/theme/Johani/pdf-previews

Samples

before

after

Notes

Like I mentioned above, this component will only work on desktop. There’s very little benefit to showing the previews on mobile since everything will be so small and very hard to read.

This component uses the native browser implementation to render the pdfs, so the results will look different on different browsers.

Also note that this respects the user’s browser preferences for rendering pdfs inline. So, if the user does not want to allow pdfs to render inline, they will see something like this on Safari for example

but that can be easily fixed if they trust your site.

Also, please note that pdf uploads are not allowed by default in Discourse. If you want to allow your users to upload pdf file, then you’ll need add that extension to either the

authorized_extensions

If you want all of your users to be able to upload pdfs, or

authorized_extensions_for_staff

if you want to limit that to staff members.

How do I use it?

  1. install the component
  2. allow pdf uploads
  3. refresh the page
  4. upload a pdf

That’s it. The rest should work automatigcally.

How do I install this theme component?

Follow the theme installation guide and add the theme component to your active themes.

If you’re new to Discourse themes, you can learn more about them here.

42 Likes

Would it be possible to make PDF Preview suppressable by prepending a space before the upload link, like with oneboxing? Sometimes you want a list of documents and not previews. Sometimes you want a preview.

6 Likes

I’m on Safari on MacOS Catalina, and I don’t have anything disabling in-browser PDF display—for instance, http://www.orimi.com/pdf-test.pdf displays fine. But I’m still getting the “Blocked Plug-in” window/message when I view the preview in theme-creator.

Site-specific settings in Safari prefs aren’t any different than other websites.

Is that happening for anyone else?

2 Likes

Still not working for me on Safari in MacOS Big Sur. No special settings to blog plugins, and other PDFs display in the browser.

Safari Web Inspector has the following complaints when loading the preview page in theme-creator:
Unrecognized Content-Security-Policy directive 'worker-src'.
Refused to load blob:https://theme-creator.discourse.org/7b9b62c7-e782-4080-a521-04e3b06aa142 because it does not appear in the object-src directive of the Content Security Policy.

2 Likes

This would be a vast improvement to this component! Is that doable, @Johani?

2 Likes

Same issue for me on Firefox, but only after the 2nd visit :wink:
Is there a workaround for this? Manual declaration in the CSP config?

Thank you

1 Like

This has stopped working on my site. I get a big black box instead of the PDF preview:

Disabling plugins via Safe Mode makes no difference, nor does removing every other Theme component.

It has happened after moving image and file uploads to S3, which might be the culprit. I hope not, because they can’t be moved back easily!

I’m stumped. Shame, as it is a great component. Any suggestions?

1 Like

I am seeing the same behaviour with s3 uploads on.

2 Likes

Are you still able to download the pdf ?
Still working for me (s3 + secure media and no cdn) :thinking:

1 Like

Yes, we are. Have the same setup as you (I think).

1 Like

:thinking:

  • my links in the messages are in the form of domain/secure-media-uploads/original/...
  • but in the console/network I can see that the actual downloads come from the bucket
    Do you see the amz credential ?

if not maybe this coud help ?

I also remember that something weird was happening when I tried to move a post from categories (or was it a copy/paste?) it finally worked when I re-uploaded the file.

1 Like

I am experiencing this same behavior on a fresh discourse installation and a fresh PDF attachment.

2 Likes

Thanks @Benjamin_D. Turns out I don’t have secure uploads enabled, and my links all look nice and work fine, such as this one:

https://healthforum.nz/uploads/short-url/jyY18nDviITy5inQ3Rw7xQp0cyS.pdf

So I’m stumped - especially as to why it works in two forums I run and not the other - S3 being the only difference. And that you have it working with S3. I’m really confused.

1 Like

After updating to the latest version of discourse, the pdf-attachements are no longer displayed. What could be the problem ?

1 Like

It may be a conflict with another component or theme. It’s working as expected for me. Start by disabling other components and try using the default theme if yours is different. Same with plugins.

2 Likes

Ok - I’ve made progress. Disabling S3 uploads fixes it for new uploads. But I’m left with a S3 / local mess if I go down that road!

If could be that I am not using the CDN thingo (CloudFront) which throws up the annoying errors on the admin page. I’ll have a crack setting that up and see if that works.

later - nope, a CDN makes no difference.

much later - have removed S3 uploads successfully (with a bit of sweat) so all good now.

Now, I’m keen to improve it! Is any clever person with the skills interested in giving this a crack?

1 Like