Aperçus de PDF en ligne

[Alon1 (Alon)]

J’ai essayé cela, j’ai défini cors origins sur https://xxxxx.s3.us-east-2.amazonaws.com
j’ai également défini DISCOURSE_ENABLE_CORS: true dans le /var/discourse/containers/app.yml
mais cela ne fonctionne pas.

[tobiaseigen]

Et vous avez fait un ./launcher rebuild app après avoir apporté des modifications à app.yml ? Vous pourriez également avoir besoin de faire un rafraîchissement forcé du navigateur.

[tobiaseigen]

Soit dit en passant, vous pourriez vérifier la section des fichiers des paramètres d’administration pour voir si vous avez modifié des paramètres qui affectent cette fonctionnalité. Je ne pense pas non plus que cette fonctionnalité puisse fonctionner si vous créez un lien vers un PDF hébergé sur un autre serveur. Je viens de tester cela sur mon site et le même PDF servi à distance n’a pas affiché l’aperçu.

Faites-nous savoir si vous trouvez la source du problème !

Exemple de markdown d’un article où le lien distant n’a pas fonctionné mais le fichier téléchargé localement a fonctionné.

distant :

[test remote pdf](https://jsoncompare.org/LearningContainer/SampleFiles/PDF/sample-pdf-with-images.pdf)

téléchargé localement :

[sample-pdf-with-images.pdf|attachment](upload://uOJLgHidEXnbqPRn2p6yP10ecQU.pdf) (3,8 Mo)

à quoi ça ressemble :

[Alon1 (Alon)]

@tobiaseigen

Et vous avez fait un ./launcher rebuild app après avoir apporté des modifications à app.yml ? Vous pourriez également avoir besoin de faire un actualisation matérielle du navigateur.

oui. mais ça n’a pas fonctionné.

Lorsque vous activez S3 dans Discourse

Alors par définition, les fichiers sont stockés sur un domaine différent.
Je suppose que cela résout le problème. Mais j’espère toujours que le plugin pourra être rendu compatible avec les installations Discourse qui ont S3 activé.

[tobiaseigen]

Je ne suis pas très familier avec cette configuration. Avez-vous suivi ces instructions ?

Configure an S3 compatible object storage provider for uploads

This topic covers how to configure some common S3 compatible Object Storage providers (S3 clones). See Set up file and image uploads to S3 for more details about Amazon AWS S3 configuration, which is officially supported and used internally by Discourse for our hosting services. Provider Service Name Works with Discourse? Amazon AWS S3 Yes Digital Ocean Spaces Yes Linode Object Storage Yes Google Cloud Storage Yes Scaleway Object Storage Yes Vultr Obj…

[Alon1 (Alon)]

Oui, j’ai S3 (et le paramètre associé « médias sécurisés ») qui fonctionne depuis quelques années sans problème.
Seul le composant PDF Inline ne fonctionne pas avec ce paramètre.

À titre de référence, même en configurant app.yml comme ceci :

DISCOURSE_ENABLE_CORS: true
DISCOURSE_CORS_ORIGIN: ‘*’

n’aide pas.

[nathank (Nathan Kershaw)]

@Alon1

Oui, j’ai le S3 (et le paramètre associé « médias sécurisés ») qui fonctionne depuis quelques années sans problème.

J’ai rencontré exactement le même problème et j’ai fini par inverser mes téléchargements S3 juste pour que ce TC fonctionne, car il a une grande valeur pour nous :

Inline PDF Previews

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 sk…

Je pense vraiment que, comme il s’agit d’un official et que les téléchargements S3 sont encouragés, cela devrait être examiné pour voir s’il est possible de le faire fonctionner avec S3 d’une manière ou d’une autre. Il se pourrait que les PDF soient spécifiquement exclus des téléchargements S3, mais ce serait nul car certains sont énormes !

[Alon1 (Alon)]

@nathankershaw

Je pense vraiment que, comme il s’agit d’une official et que les téléchargements S3 sont encouragés, cela devrait être examiné pour voir si cela peut fonctionner avec S3 d’une manière ou d’une autre.

Je ne pense pas que quiconque serait en désaccord.
Je suppose qu’il s’agit de sensibilisation et de priorités.
Au moins en ce qui concerne la « sensibilisation », peut-être que @Johani, l’OP, pourrait ajouter une petite note dans le sujet de cette discussion indiquant que le composant PDF en ligne ne fonctionne pas avec S3 activé.
Cela ferait gagner du temps aux autres en matière de dépannage et sensibiliserait au problème.

[JammyDodger]

Il y a quelques informations sur S3 dans ces publications que j’ai pêchées dans le minuteur automatique si elles peuvent être utiles ?

@travelvc

J’ai pu résoudre ce problème en ajoutant la politique CORS suivante dans la configuration de mon bucket S3.

<CORSConfiguration>
 <CORSRule>
   <AllowedOrigin>https://mydiscourse.url/</AllowedOrigin>
   <AllowedMethod>GET</AllowedMethod>
   <AllowedHeader>*</AllowedHeader>
   <ExposeHeader>Access-Control-Allow-Origin</ExposeHeader>
 </CORSRule>
</CORSConfiguration>

@Ed_Bobkov

Il est nécessaire d’ajouter que si vous voyez ce texte dans le message d’erreur from origin 'https://lounge.travelmassive.com' has been où votre domaine est sans slash / à la fin, alors dans la configuration CORS vous devriez également ajouter votre domaine sans slash à la fin comme ceci :
https://mydiscourse.url

[Alon1 (Alon)]

Oui, ça fonctionne
Pour référence si quelqu’un d’autre en a besoin :

1. Allez dans la console AWS, section Buckets https://s3.console.aws.amazon.com/s3/buckets et sélectionnez le bucket qui a été utilisé pour votre installation Discourse

2. Choisissez l’onglet Permissions
   

3. Faites défiler jusqu’à « Partage de ressources cross-origin (CORS) » et écrivez :

[
    {
        "AllowedHeaders": [
            "*"
        ],
        "AllowedMethods": [
            "GET"
        ],
        "AllowedOrigins": [
            "https://my-site.com"
        ],
        "ExposeHeaders": []
    }
]

Cela devrait ressembler à ceci :

[nathank (Nathan Kershaw)]

J’aurais aimé trouver ça pendant que j’étais encore sur les téléchargements S3 !!

Je devrai peut-être y revenir maintenant. @JammyDodger, je me demande si ces choses devraient être notées à la fois sur S3 et sur ce fil de discussion afin que d’autres ne trébuchent pas là-dessus.

[JammyDodger]

@nathankershaw

Il faudra peut-être y revenir maintenant. @JammyDodger, je me demande si ces choses devraient être notées à la fois sur S3 et sur ce fil de discussion afin que d’autres ne trébuchent pas là-dessus.

Absolument. J’attendais juste une confirmation que cela fonctionnait avant de réfléchir à la meilleure façon d’apporter une modification.

[Ralf_Stockmann]

Deux idées pour résoudre le même problème : la fenêtre d’affichage de Discourse est assez étroite, de sorte que la plupart des PDF sont trop petits pour être lus en ligne. Pour résoudre ce problème, nous pourrions :
a) rendre l’iframe PDF redimensionnable ? J’ai déjà essayé avec CSS, mais sans succès - la grille sous-jacente semble être un obstacle.
b) proposer un second lien « ouvrir dans un nouvel onglet » à côté du lien de téléchargement ? Je suis très désireux de ne pas télécharger trop de choses depuis notre forum.

[nathank (Nathan Kershaw)]

@Ralf_Stockmann

b) proposer un second lien « ouvrir dans un nouvel onglet » en plus du lien de téléchargement ? Je tiens beaucoup à ne pas télécharger trop de choses sur notre forum.

Ce serait une amélioration notable ! Et ne devrait pas être trop difficile à ajouter, je pense. Je vais peut-être tenter un PR pour cela si j’ai le temps dans les prochains jours.

[tobiaseigen]

Je pense que (b) est déjà proposé comme option, par exemple en ligne ou ouvrir dans un nouvel onglet. Peut-être une troisième option pour permettre aux utilisateurs de voir en ligne et d’ouvrir dans un nouvel onglet ? J’aime aussi cette idée.

(a) peut être difficile étant donné la difficulté d’obtenir un rendu correct dans un article.

[Alon1 (Alon)]

Je serais heureux de voir un bouton d’expansion

dans la barre d’outils qui affiche simplement le PDF en plein écran au lieu d’inline.

[denvergeeks]

@Ralf_Stockmann et @Alon1 avez-vous essayé…

IFrame Lightboxes

This is a theme component that adds the ability to open iFrames in lightboxes. Samples This component adds an “expand” button on top of the iframes you enable it on. [expand button] Clicking the button will open the iframe in fullscreen in a lightbox. [full screen iframe lightbox] Clicking either the dark area around the iframe or the x at the top right corner closes the lightbox. The same way it works for default image lightboxes. Settings There’s only one setting. You add the domains…

Aussi, sur mon Discourse, j’utilise cette méthode…

Intégrer un PDF depuis Google Drive

(C’est ma méthode préférée pour que les PDF dans les iFrames soient responsives - les autres méthodes échouent la plupart du temps à être responsives sur tous les navigateurs.)

1. Partager
2. Copier le lien de partage
3. Ouvrir le lien de partage dans un nouvel onglet
4. Cliquer sur les 3 points verticaux en haut à droite
5. Sélectionner “Intégrer l’élément”
6. Copier le code iFrame affiché
7. Le coller dans l’éditeur Discourse

Un PDF de test sur Google Drive est intégré ci-dessous, que vous pouvez << Télécharger ici >>

<iframe src="https://drive.google.com/file/d/1KQ-jn7R0NmZxw955QaPu3lvLFh5zpnDe/preview" width="640" height="480" allow="autoplay"></iframe>

Voici à quoi cela ressemble… (que vous pouvez également essayer en direct ICI sur mon site)

[Alon1 (Alon)]

C’est super ! \nIl suffit de (1) installer le composant de thème IFrame Lightboxes et (2) d’ajouter l’URL de mon propre site Web à la liste des « domaines d’origine des iframes » dans les paramètres du composant, et cela fonctionne ! Il ajoute le bouton d’expansion juste au-dessus du coin supérieur droit du PDF en ligne \n

\n\n\nDirectement prêt à l’emploi

[thoka (Thomas Kalka)]

Comme je n’étais toujours pas en mesure d’ouvrir les PDF dans un nouvel onglet, j’ai écrit un petit plugin pour servir tous les PDF locaux avec content-disposition: inline :

GitHub - thoka/discourse-send-pdf-inline: Patch discourse do serve PDFs inline