it-swarm.com.de

HTML eingebettet PDF iframe

Ich habe das Tag verwendet, um eine PDF-Datei einzubetten.

<iframe id="iframepdf" src="files/example.pdf"></iframe>

Dies funktioniert gut in Chrome, IE8 +, Firefox usw., aber aus irgendeinem Grund werden die Dateien heruntergeladen, wenn sie in IE8 angezeigt werden, anstatt sie einzubetten. Ich weiß, dass dieser Browser veraltet ist, aber es ist der Standardbrowser in meinem Büro, und als solcher muss die Website dafür entworfen werden.

Hat jemand eine Idee, warum dies geschieht, wie ich es beheben oder eine Fehlermeldung ausgeben kann, anstatt die Dateien herunterladen zu lassen?

47
user2931470

Es wurde heruntergeladen , wahrscheinlich , weil kein Adobe Reader-Plug-In installiert ist. In diesem Fall weiß IE (es ist egal, welche Version) nicht, wie es gerendert wird, und es wird einfach eine Datei heruntergeladen (Chrome hat zum Beispiel eine eigene eingebettete PDF Renderer).

Das gesagt. <iframe> Ist nicht die beste Methode, um ein PDF (Kompatibilität mit mobilen Browsern, z. B. Safari), anzuzeigen. Einige Browser öffnen diese Datei immer in einer externen Anwendung (oder Das Beste und Kompatibelste, was ich gefunden habe, ist ein bisschen knifflig, funktioniert aber mit allen Browsern, die ich ausprobiert habe (sogar ziemlich veraltet):

Behalten Sie Ihren <iframe> - Tag bei, aber zeigen Sie keinen PDF darin an, er wird mit einer HTML-Seite gefüllt, die aus einem <object> - Tag besteht HTML-Wrapping-Seite für Ihre PDF sollte so aussehen :

<html>
<body>
    <object data="your_url_to_pdf" type="application/pdf">
        <embed src="your_url_to_pdf" type="application/pdf" />
    </object>
</body>
</html>

Natürlich muss noch das entsprechende Plug-In im Browser installiert sein. Schauen Sie auch unter dieser Beitrag nach, wenn Sie Safari auf Mobilgeräten unterstützen müssen.

1. Warum <embed> In <object> Schachteln? Sie finden Antwort hier auf SO . Anstelle des verschachtelten Tags <embed> Können Sie (sollte!) Eine benutzerdefinierte Nachricht für Ihre Benutzer bereitstellen (oder einen integrierten Viewer, siehe nächster Absatz). Heutzutage kann <object> Ohne Bedenken verwendet werden und <embed> Ist nutzlos.

2nd. Warum eine HTML-Seite? Sie können also einen Fallback bereitstellen, wenn der PDF viewer nicht unterstützt wird. Interner Viewer, einfache HTML-Fehlermeldungen/-Optionen usw.

Es ist schwierig, die PDF Unterstützung zu überprüfen, damit Sie Ihren Kunden einen alternativen Viewer zur Verfügung stellen können. Schauen Sie sich das PDF.JS Projekt an, es ist ziemlich gut, aber die Renderqualität - für Desktop-Browser - sind nicht so gut wie ein nativer PDF Renderer) (ich habe keinen Unterschied bei Mobilgeräten festgestellt Browser wegen der Bildschirmgröße, nehme ich an).

68
Adriano Repetti

Wenn im Browser ein PDF-Plugin installiert ist, wird das Objekt ausgeführt, andernfalls wird es mit dem PDF Viewer von Google als normales HTML angezeigt:

<object data="your_url_to_pdf" type="application/pdf">
    <iframe src="https://docs.google.com/viewer?url=your_url_to_pdf&embedded=true"></iframe>
</object>
28
mgutt

Iframe

<iframe id="fred" style="border:1px solid #666CCC" title="PDF in an i-Frame" src="PDFData.pdf" frameborder="1" scrolling="auto" height="1100" width="850" ></iframe>

Objekt

<object data="your_url_to_pdf" type="application/pdf">
  <embed src="your_url_to_pdf" type="application/pdf" />
</object>
9
Muddasir Abbas