Program Tip

페이지에 PDF 뷰어를 삽입하는 방법은 무엇입니까?

programtip 2020. 10. 15. 21:26
반응형

페이지에 PDF 뷰어를 삽입하는 방법은 무엇입니까?


내가 착각하지 않았다면 Google 문서 도구는를 통해 웹 페이지와 동일한 서버에 저장된 PDF를 표시하는 방법을 제공 <iframe>하지만 브라우저 간 호환 방식으로이를 수행 할 수있는 방법을 알아야합니다.


Philip Hutchison의 PDFObject 사용을 고려할 수 있습니다.

또는 자바 스크립트가 아닌 솔루션을 찾고 있다면 다음과 같은 마크 업을 사용할 수 있습니다.

<object data="myfile.pdf" type="application/pdf" width="100%" height="100%">
  <p>Alternative text - include a link <a href="myfile.pdf">to the PDF!</a></p>
</object>

PDF.js 는 네이티브 코드 지원없이 충실하고 효율적인 PDF (Portable Document Format) 렌더러를 빌드하는 방법을 탐색하는 HTML5 기술 실험입니다. 커뮤니티 기반이며 Mozilla Labs에서 지원합니다.

여기 에서 데모를 볼 수 있습니다 .


이 방법이 조금 더 잘 작동 할 수 있습니다.

<embed src= "MyHome.pdf" width= "500" height= "375">

내가 착각하지 않았다면 OP는 Google의 내장 PDF 디스플레이 서버가 자신의 웹 사이트에 PDF를 표시할지 여부를 묻습니다 (나중에 .js 솔루션을 수락했지만).

그래서, 1 년 반 후 : 그렇습니다.

http://googlesystem.blogspot.ca/2009/09/embeddable-google-document-viewer.html을 참조하세요 . 또한 https://docs.google.com/viewer를 참조 하고 표시하려는 파일의 URL을 연결 하십시오 .

편집 : 다시 읽고, OP는 iFrame을 사용하지 않는 솔루션을 요청했습니다. Google 뷰어로는 불가능하다고 생각합니다.


Flex Paper http://flexpaper.devaldi.com/을 사용해보십시오.

그것은 낙서처럼 작동합니다


다양한 Reader 기본 설정에서 솔루션을 테스트해야합니다. 사이트 방문자는 브라우저와 달리 Reader / Acrobat에서 PDF를 열도록 브라우저를 설정할 수 있습니다 (예 : Firefox에서 Acrobat 플러그인 비활성화).

Adobe Acrobat과 Adobe Reader의 버전이 다르기 때문에 Firefox가 인식하는 두 개의 다른 Acrobat 플러그인이 있기 때문에 결과를 확신 할 수 없습니다. 그러나 적어도 웹 사이트 방문자가 어떤 일이 발생하는지 테스트해야하는 것으로 보입니다. 브라우저에서 PDF를 열지 않도록 브라우저를 설정했습니다. 다른 방법으로 사용 가능한 웹 페이지로 보이는 것을보고 브라우저가 요청하지 않은 PDF 파일을 열라고 잔소리를하면 상당히 짜증날 수 있습니다. 어떤 경우에는 PDF 파일이 브라우저가 아닌 Adobe Reader에서 자발적으로 열리고 다른 경우에는 브라우저가 파일이 존재하지 않는다는 대화 상자를 표시했습니다.

나는 iframe과 객체 모두와 같은 불일치, 다른 코드에 대한 다른 문제에 부딪 혔습니다.

이것은 간단한 HTML 코드입니다. 제안 된 프레임 워크를 시도하지 않았습니다.


저는 FlowPaper, 특히 여기에서 찾을 수있는 새로운 Elements 모드를 선택할 것입니다 : https://flowpaper.com/demo/

텍스트를 선명하게 유지하는 동시에 PDF를 크게 평평하게하여 모바일 장치에서 훨씬 빠르게로드됩니다.


coolwanglu의 pdf2htmlEX는 아마도 pdf 파일을 html로 변환하는 최고의 솔루션 일 것입니다. 간단한 변환을 수행 한 다음 html 페이지를 iframe 또는 이와 유사한 것으로 임베드 할 수 있습니다.

참고 URL : https://stackoverflow.com/questions/14081128/how-to-embed-a-pdf-viewer-in-a-page

반응형