Inline-PDF-Vorschauen

Hallo,

ich verwende diese Komponente schon seit einiger Zeit. Heute habe ich festgestellt, dass eingebettete Vorschauen auf Seiten nicht mehr angezeigt werden.

2.8.0.beta6

Beispiel

1 „Gefällt mir“

Sieht für mich in allen Desktop-Browsern in Ordnung aus:

5 „Gefällt mir“

Und so sieht es in iPad-Safari aus:

4 „Gefällt mir“

Vielen Dank an alle,

Ich habe es gerade noch einmal geprüft: Safari auf dem Mac funktioniert, Edge ebenfalls, aber Chrome ist gescheitert. Interessant.



4 „Gefällt mir“

Wie können wir in Safari auf dem Mac zulassen, dass dieses Plugin verwendet wird? Bei anderen Browsern funktioniert es einwandfrei, aber in Safari wird es blockiert, selbst nachdem ich die Inhaltsblocker im Bereich „Einstellungen/Websites" deaktiviert habe. Gibt es noch einen anderen Bereich, in dem man Blocker ausschalten muss? Jede Hilfe wäre willkommen.

1 „Gefällt mir“

Ich weiß es wirklich nicht, also ist das nur eine Verschwendung von Bandbreite, aber Safari war in der Vergangenheit wegen seiner ziemlich strengen CSP-Regeln und anderer Sicherheitsaspekte problematisch. Das sollte aber dann alle Safari-Versionen betreffen, nicht nur die von Mac, denke ich.

3 „Gefällt mir“

Bei mir funktioniert es in Safari auf dem Mac. Der einzige Ort, an dem es bei mir nicht funktioniert, ist das iPhone (Safari, FF und Chrome). Ich habe es kürzlich nicht auf dem iPad getestet.

3 „Gefällt mir“

Alle Webbrowser auf iOS/iPadOS verwenden aufgrund der Einschränkungen von Apple denselben Rendering-Engine (WebKit), sodass das ohnehin keine Rolle spielen würde.

2 „Gefällt mir“

Das ist es, was ich auf meinem neuen MacBook Air mit Safari v. 14.1.1 sehe.

Ich muss irgendwo eine falsche Einstellung haben…

3 „Gefällt mir“

Versuchen Sie, Safari auf die neueste Version zu aktualisieren.

2 „Gefällt mir“

Ich habe gerade ein neues Update veröffentlicht.

Sie können nun die Vorschau für bestimmte PDF-Dateien deaktivieren. Es funktioniert nicht exakt wie Oneboxes, da die Implementierung in einer Theme-Komponente etwas komplizierter wäre, aber es ist sehr ähnlich.

Wenn Sie eine PDF hochladen, sehen Sie standardmäßig Folgendes im Editor:

[file.pdf|attachment](upload://2cLML0SIwebGHDjlKRVzZ3VRv0f.pdf) (524,1 KB)

Sie müssen lediglich ein Leerzeichen vor den Dateinamen setzen, wie hier:

[ file.pdf|attachment](upload://2cLML0SIwebGHDjlKRVzZ3VRv0f.pdf) (524,1 KB)

Beachten Sie, dass das Leerzeichen innerhalb der Klammern stehen muss. Es hat keinen Einfluss auf den Dateinamen beim Herunterladen und wirkt sich auch nicht auf die im Beitrag gerenderte Dateibeschreibung aus.

Sobald Sie dies tun, wird der PDF-Datei im verarbeiteten Beitrag keine Vorschau mehr hinzugefügt.

Das Update fügt eine neue Einstellung hinzu.

Es gibt zwei Optionen:

Inline und New Tab

Wenn Sie Inline auswählen, werden PDF-Vorschauen wie zuvor im Beitrag gerendert.

Wenn Sie New Tab auswählen, erstellt die Komponente keine Inline-Vorschau. Der Link für den Anhang öffnet jedoch einen neuen Tab. In diesem neuen Tab wird die PDF-Datei im nativen Browser-Reader angezeigt.

Das Symbol neben dem Anhangslink ändert sich von download zu external-link.

Der Standardwert für die Einstellung ist Inline. Das bedeutet, es hat keine Auswirkungen auf Seiten, auf denen diese Komponente bereits vor dem Update installiert war. Es wird lediglich eine neue Option hinzugefügt, die Sie aktiviert werden müssen.

Es gab einige Berichte, dass dies auf Safari und einigen iOS-Geräten nicht funktioniert – was ich jedoch nicht reproduzieren konnte. Das Update versucht, dieses Problem zu beheben, indem die PDF als Base64-URL anstelle eines Blobs geladen wird, da dies auf Apple-Geräten bekanntermaßen sehr fehleranfällig ist.

Bitte aktualisieren Sie die Komponente und stellen Sie sicher, dass auch Ihr Browser auf dem neuesten Stand ist. Falls es aus irgendeinem Grund auf einem Apple-Gerät nicht funktioniert, prüfen Sie bitte – falls möglich – die Browserkonsole und teilen Sie mir mit, was Sie sehen.

10 „Gefällt mir“

Seit dem Update auf die neueste Version 2.8.0.beta6 (a1daf9fe53) scheinen PDF-Vorschauen etwas langsamer zu laden. In mindestens einem Fall wird eine von drei PDFs in einem Beitrag in Chrome nicht angezeigt:

Es handelt sich nicht um ein Caching-Problem – selbst nach dem Leeren des Chrome-Caches, dem Speichern der PDF mit einer geringfügigen Änderung und dem erneuten Hochladen wird die Vorschau immer noch nicht angezeigt. Im Fehlerprotokoll gibt es keine Einträge. Chrome ist auf die neueste Version aktualisiert.

Konsole:

3 „Gefällt mir“

Ich nutze Version 2.8.0.beta6. PC – Windows 10. Ähnliche Beobachtung: Firefox ist etwas langsam, aber die Vorschau lädt schließlich. Chrome zeigt sie nicht an; es scheint, als friere es bei diesem grauen Platzhalter ein.

4 „Gefällt mir“

Vielen Dank für die Details. Da zwei der Dateien problemlos geladen wurden, ging ich davon aus, dass es wahrscheinlich mit der Dateigröße zu tun hat – und tatsächlich war das der Fall.

Wenn ich eine große PDF-Datei hochlade, funktioniert sie in Firefox einwandfrei, scheitert aber in Chrome. Ich habe mich etwas damit beschäftigt, und es scheint, dass das Längenlimit für Base64-URLs weitgehend vom Anbieter bestimmt wird. Firefox hat keine Limits. Chrome begrenzt sie auf 2 MB.

Das bedeutet also, dass eine Base64-URL keine tragfähige Option ist, und wir müssten wieder zu Blob-URLs zurückkehren. Es scheint, dass Safari eine bessere Unterstützung bietet, wenn das Vorschauelement ein <object>-Tag statt eines iFrames ist.

Diese PR stellt daher alles wieder auf eine Blob-URL um und ändert das Tag zu <object>. Dies wird das Problem mit großen Dateien in Chrome definitiv beheben und hoffentlich :crossed_fingers: auch die Probleme auf Apple-Geräten lösen.

Bitte aktualisiere die Komponente erneut und lass mich wissen, falls du weiterhin Probleme hast.

3 „Gefällt mir“

Die Dateigrößen im Beitrag mit 3 PDFs betragen 548,3 KB, 1,1 MB und 1,6 MB, in dieser Reihenfolge von oben nach unten. Nach der alleinigen Aktualisierung der Komponente werden die Vorschauen zwar angezeigt, jedoch nicht mehr in voller Breite in Chrome:

EDIT: Firefox sieht wie oben in Chrome aus, und Safari zeigt keine Vorschauen, sondern graue Kästen:

3 „Gefällt mir“

Danke, ich habe eine kleine Korrektur für das Größenproblem eingepflegt.

UX: adds missing iFrame attributes by hnb-ku · Pull Request #4 · discourse/discourse-pdf-previews · GitHub

Das wird das Problem auf Safari wahrscheinlich nicht beheben, aber bitte probiere es aus und gib mir Bescheid.

3 „Gefällt mir“

Ja – Chrome und FF sind behoben, Safari bleibt unverändert mit nur den grauen Boxen.

3 „Gefällt mir“

Nur zur Bestätigung: Safari hat bei dir vorher funktioniert, oder?

3 „Gefällt mir“

Ja, bis zum letzten Update funktionierten alle Desktop-Browser einwandfrei. Ich kann nicht genau sagen, wie lange Safari noch problemlos lief, da es nicht mein täglicher Browser ist, aber ich kann bestätigen, dass es in der Vergangenheit bereits funktioniert hat.

3 „Gefällt mir“

Dieser Commit sollte Safari beheben.

FIX: previews are still broken on MacOS safari by hnb-ku · Pull Request #5 · discourse/discourse-pdf-previews · GitHub

Ich habe es gerade auf einem MacBook getestet, und es funktioniert bei mir einwandfrei in Safari, Chrome und Firefox.

Wenn jemand dieses Problem sieht

liegt es an eurer Konfiguration, nicht an der Komponente.

How to unblock a blocked plug-in to displ… - Apple Community

Bitte beachtet außerdem, dass diese Komponente PDF-Vorschauen auf Mobilgeräten – wie von Discourse definiert, egal ob iOS oder Android – nie unterstützt hat. Das ist also das erwartete Verhalten.

7 „Gefällt mir“