Cách mở tệp PDF trong <iframe>?

Question

Tôi muốn mở tệp pdf trong khung nội tuyến. Tôi đang sử dụng mã sau đây:

<a class="iframeLink" href="https://something.com/HTC_One_XL_User_Guide.pdf" 
    jQuery1640737952376988841="85"> User guide </a> 

Nó đang mở trong Firefox nhưng không mở trong IE8.

Có ai biết cách làm cho nó hoạt động tốt cho IE không?

Answer 1

Đây là mã để liên kết HTTP (S) tiếp cận PDF từ một :

<iframe src="https://research.google.com/pubs/archive/44678.pdf" 
    width="800px" height="600px" > 

Fiddle: http://jsfiddle.net/cEuZ3/1545/

EDIT: và bạn có thể sử dụng Javascript, từ thẻ <a> (onclick sự kiện) để đặt thuộc tính SRC của iFrame tại thời gian chạy ...

CHỈNH SỬA 2: Xuất hiện, đó là lỗi (nhưng có cách giải quyết):

PDF files do not open in Internet Explorer with Adobe Reader 10.0 - users get an empty gray screen. How can I fix this for my users?

Answer 2

Sử dụng iframe để "hiển thị" một PDF sẽ không hoạt động trên tất cả các trình duyệt; nó phụ thuộc vào cách trình duyệt xử lý các tệp PDF. Một số trình duyệt (chẳng hạn như Firefox và Chrome) có PDF được tích hợp sẵn cho phép chúng hiển thị nội tuyến PDF ở đâu đó như một số trình duyệt cũ hơn (có lẽ phiên bản cũ hơn của IE cố gắng tải xuống tệp thay thế).

Thay vào đó, tôi khuyên bạn nên kiểm tra PDFObject thư viện Javascript để nhúng tệp PDF vào tệp HTML. Nó xử lý khả năng tương thích trình duyệt khá tốt và rất có thể sẽ hoạt động trên IE8.

Trong HTML, bạn có thể thiết lập một div để hiển thị các file PDF:

<div id="pdfRenderer"></div> 

Sau đó, bạn có thể có mã Javascript để nhúng một PDF trong div rằng:

var pdf = new PDFObject({ 
    url: "https://something.com/HTC_One_XL_User_Guide.pdf", 
    id: "pdfRendered", 
    pdfOpenParams: { 
    view: "FitH" 
    } 
}).embed("pdfRenderer"); 

Answer 3

Nó cũng quan trọng để đảm bảo rằng máy chủ web gửi tệp có Content-Disposition = inline. này có thể không phải là trường hợp nếu bạn đang đọc tập tin bản thân và gửi nội dung của nó vào trình duyệt:

trong php nó sẽ giống như thế này ...

...headers... 
header("Content-Disposition: inline; filename=doc.pdf"); 
...headers... 

readfile('localfilepath.pdf') 

Answer 4

Làm điều đó như thế này:

<iframe src="http://samplepdf.com/sample.pdf" width="800px" height="600px"></iframe> 

Hãy nhớ đóng thẻ iframe.