Eingebundenes PDF auf mobilen Endgeräten geht nicht

[Hans Klawun]

So kurz vor den Feiertagen habe ich doch noch einmal eine Frage.

Eine eingebundene PDF-Datei in einer Webseite wird auf Android oder iOS nicht oder fehlerhaft angezeigt.

Versucht habe ich iframe, embeded, oder mit objekt
##
Mit dem Befehl <object width=“…“ height=“…“ type=“application/pdf“ data=“PFAD/NAME. ...
Sie können außerdem den <iframe>-Tag verwenden. ...
Ebenfalls können Sie den Tag <embed> verwenden, um eine PDF in Ihre Webseite einzubetten.
##

Gibt es eine Möglichkeit das ein PDF auf allen Endgeräten angezeigt wird ?

Danke

[Tommy Herrmann]

Hallo,

also ich habe mich da jetzt auch noch nicht wirklich schlau gemacht warum das so ist - aber nein - man kann das PDF nicht direkt anzeigen.

Ich musste aber auch die Erkenntnis gewinnen, dass man eine PDF-Datei z.B. im "Iframe" am mobilen Gerät nicht anzeigen lassen kann. Es wird sogleich eine App zur Anzeige der PDF Datei vorgeschlagen, wie z.B. der "Adobe Reader". Man muss also immer erst diese App öffnen oder das eben ablehnen, bevor man die Webseite überhaupt sehen kann.

Ich habe dann diese Lösung für mich erdacht.

Beispiel:

Auf dieser Seite zeige ich den Code für den Einbau eines Formulars als PDF-Datei in einem "Iframe" am Desktop:

https://www.mobirise-tutorials.com/Form ... mular.html

... am Smartphone dagegen nur einen Text-Link, den man zunächst anklicken muss.

Das habe ich mit diesen beiden IDs erreicht, denen ich die entsprechenden Anweisungen zur Anzeige in der CSS gegeben habe:

Code: Alles auswählen

@media (min-width: 992px) {
  #zeigeLink {
    display: none;
  }
}
#myFrame {
  width: 90%;
  margin-bottom: 50px;
}
@media (max-width: 991px) {
  #myFrame {
    display: none;
    margin-bottom: 0px;
  }
}

... und hier die HTML-Ausgabe mit den IDs:

Code: Alles auswählen

<p id="zeigeLink"><a href="http://www.mobirise-tutorials.com/Formular/PDF/Formular-Code.pdf" target="_blank" class="text-primary"><span class="mbri-mobile mbr-iconfont mbr-iconfont-btn"></span>Hier klicken um die PDF-Datei am Handy und mobilen Gerät zu betrachten</a>.</p></div>
                    
<div class="row justify-content-center">
    <iframe id="myFrame" src="./PDF/Formular-Code.pdf" height="500"></iframe>
</div>

[Werner-Zenk.de]

Eine PDF-Datei ist halt eine externe Datei und wird heruntergeladen.
Nur wenn es einen internen PDF-Reader im Browser gibt, wird diese auch angezeigt.
Der Firefox (Mobile) zeigt diese komische Meldung an.
Beim Edge (Mobile) hat man wenigstens die Möglichkeit die Datei im Browser anzuzeigen.
Aber das muss dann der Benutzer entscheiden ...

[Hans Klawun]

Danke für die Informationen

[Volker]

Es geht

Hab da was gefunden mit Javascript.

Test: https://niederastroth.de/pdf/

Auf Github gefunden

Allerdings müsste es in Mobirise noch mit CSS abgepasst werden, sieht noch komisch aus am Handy
https://niederastroth.de/test1/

Macht Tommy bestimmt

[Tommy Herrmann]

Moin,

interessant

Wo genau hast Du das runter geladen (URL)? Es gibt wohl mehrere Varianten, um PDF-Dateien über JavaScript, bzw. Ajax (Asynchronous JavaScript and XML) anzuzeigen.

Ich glaube eigentlich nicht, dass ich da was mache, weil ich mit JavaScript auch immer etwas schwer tue und das nicht richtig kann. Ich meine jetzt nicht den Einbau in Mobirise, sondern das Verständnis des Skriptes. Weiterhin ist das so am Handy vollkommen unbrauchbar - warum beschreibe ich weiter unten.

Man kann ja eben ein PDF auch ganz normal auf einer HTML-Seite im Iframe anzeigen und dann am Handy eben als Link zum Download anbieten:

... oder das Iframe wird inzwischen am Handy auch als Platzhalter mit "Öffnen"-Button dargestellt, wie in meinem Screenshot unten zu sehen ist:

Ich finde das eigentlich sogar besser, weil man dann auch gleich alle Menü-Optionen einer PDF-Datei mit verwenden kann - wie zum Beispiel den Ausdruck, den man ja fast immer benötigt oder auch die Seiten- und Suchenfunktion hat.

Bei dieser JavaScript-Variante bleibt es ja dann nur möglich, den Inhalt des PDFs manuell mit der Maus zu kopieren. Zudem stehen die üblichen PDF-Optionen nicht zur Verfügung. Ein PDF sollte jedoch in der Regel als vollständiges Dokument, beispielsweise zur Bestätigung durch eine Unterschrift, downloadbar sein und solche Dokumente dürfen in vielen Fällen auch nicht geändert werden und sind daher auch oft schreibgeschützt.

Bei Deinem Beispiel könnte man zwar die einzelnen generierten Grafiken jeweils pro Seite herunterladen, jedoch ist das für den "Normalnutzer" eher unverständlich.

Außerdem ist dies keine akzeptable Lösung, da das PDF in ein Bild umgewandelt wird, was zu einem erheblichen Überlauf (Querscroller) auf dem Handy führt. Eine Anpassung der Bildgröße über CSS ist ebenfalls nicht möglich, da die Schrift dadurch unleserlich klein wäre:

Wenn man solche Dokumente downloadet um diese auszudrucken und zu unterschreiben, ist man ja eh eher mit dem Desktop am werkeln als mit dem Handy am fummeln.

Hier als Beispiel der Formular-Code des "Formular Generators" als PDF im Iframe auf der Seite dargestellt und am Handy als Link:

https://www.mobirise-tutorials.com/Form ... mular.html

… oder hier ein Beispiel mit einem Upload-Skript vom Werner nur als PDF im Iframe:

https://www.mobirise-tutorials.com/Port ... Upload.php

[Volker]

Hier gefunden: https://github.com/ankur2194/custom-htm ... compatible

Schade wenn es doch nicht geht

[Tommy Herrmann]

Ja - danke - habe das eben auch mal getestet und halte es für kein gutes Skript. Die generierten Bilder würde man in Mobirise mit CSS natürlich anpassen können, sodass es keinen Überlauf mehr gibt - aber dann ist das PDF am Handy unlesbar.

[Volker]

Aber kann man ja dann größer ziehen. War ein Versuch wert