Inline PDF Previews

Theme component
, ,
138

No i got 3 issue

  1. How to show PDF for everyone “login or not”

  2. Can i show PDFs from external URLs

  3. Why if user click on the PDF link it’s well auto download instead of open it in the URL

1 Like
139

Can anyone who is using this component together with iframe lightboxes confirm that they still get the “expand to fullscreen arrows” above the PDF preview?
This image shows the options available in a PDF viewer software or website, including buttons or icons for opening a file, adding annotations or comments, accessing settings or preferences, and potentially other functionalities related to viewing and manipulating PDF documents. (Captioned by AI)

For reference, it used to work in 2023…

1 Like
140

No. It is not available.

2 Likes
141

Rats - because it would be super helpful.

2 Likes
142

We use this TC on our site and find it very valuable. Today I created and shared a topic that includes a PDF, and it made this monstrosity: an inline PDF that can be fully navigated from an unfurl.

CleanShot 2024-08-23 at 13.38.15@2x
CleanShot 2024-08-23 at 13.38.15@2x1352×1494 353 KB

1 Like
143

Is there a way to enable this in select categories? I’m creating a topic that lists a bunch of files and it’s awkward that the PDF is expanded. I’d settle for a manual way to prevent it from triggering, like inserting a special character.

1 Like
144

Prevent what from triggering? How would you like the PDF(s) to display in the select categories?

1 Like
145

I want a way to block PDFs from being displayed inline. Where blocked, the PDF would look like any other post attachment.

146

As a simple link? Or as a Onebox? Or?

1 Like
147

All you have to do is insert a space before the name in the PDF link and you are away. This isn’t well documented (I’ve just addressed that), but I managed to get that added into the TC for the same reason a while back.

I’d prefer if it was done the same way as Oneboxes - i.e. a space in the markdown before the link, but this works well enough.

6 Likes
148

Hello

I have this error with the plugin.

Do you have any idea of ​​the origin?

The image shows a screenshot of a webpage with the title "Test d'un pdf en visibilité" and a large, empty gray box. (Captioned by AI)
The image shows a screenshot of a webpage with the title "Test d'un pdf en visibilité" and a large, empty gray box. (Captioned by AI)923×827 26.7 KB

1 Like
149

Does it happen to every PDF or just this one?

Have you tried adding your forum’s domain to allowed internal hosts ?

2 Likes
150

yes with all PDFs.

I just added it in ‘intern host’ …no improvement.

Thank you for your advice :slight_smile:

Otherwise I just found this error message in the Chrome console:

initialize-for-pdf-preview.js:84 Refused to frame ‘blob:https://forums.ffjdr.org/79cf20bf-65ac-460f-b0b0-73c10bf85890’ because it violates the following Content Security Policy directive: “default-src ‘self’ data: https:”. Note that ‘frame-src’ was not explicitly set, so ‘default-src’ is used as a fallback.

Not allowed to load local resource: blob:https://forums.ffjdr.org/79cf20bf-65ac-460f-b0b0-73c10bf85890

2 Likes
151

Check your allowed onebox iframes it should be *

2 Likes
152

I just installed this component. These are the steps I took to get it installed. My environment is S3 (Digital Ocean Spaces) and CDN (Bunny.net).

Using Chrome developer toolbar (f12) will greatly help in setting this up. Click on the network tab to validate if the pdfs are being stopped by CORS.

Digital Ocean Configuration.

  1. Go to your Spaces Settings and click on Add CORS Configurations
  2. Settings:
Origin:   Your discourse URL - use full https://discourse.url
Allowed Methods:  GET and HEAD
Add the following headers:
      Access-Control-Allow-Methods 
      Access-Control-Allow-Origin
      Origin
      Range
Access Control Max Age: 0

  1. My screen looked like this:

    This image shows an API documentation interface with checked "GET" and "HEAD" methods, enabled "Access-Control-Allow-Methods" and "Access-Control-Allow-Origin" headers, and a "0" in the "Access Control Max Age" field. (Captioned by AI)
    This image shows an API documentation interface with checked "GET" and "HEAD" methods, enabled "Access-Control-Allow-Methods" and "Access-Control-Allow-Origin" headers, and a "0" in the "Access Control Max Age" field. (Captioned by AI)599×543 16.5 KB

  2. Save and validate via main screen.

CDN (Bunny.net) Configuration

I had to tell the CDN to deliver CORS headers for the filetype *.pdf

  1. Select your CDN and look for the option for Headers.
  2. Turn on “Add CORS Headers”
  3. Add PDF to the file extension
  4. Save.

After I did these two setups, everything was working great.

You might have a different set of tools, but this might help you trouble shoot/solve any problems you may have.

1 Like