- 404에러페이지
- javascript 유효성체크
- asp.net Select
- ASP.Net Core 404
- django 엑셀불러오기
- XSS PHP
- jquery 바코드생성
- XSS방어
- ViewBag
- javascript 바코드 생성
- TempData
- ViewData
- 강제이동
- php 캐쉬제거
- 바코드 생성하기
- javascript 바코드스캔
- 바코드 스캔하기
- jquery 바코드
- 파일업로드 유효성체크
- 파일업로드 체크
- 하드 마이그레이션
- Mac Oracle
- asp.net dropdownlist
- asp.net core Select
- SSD 복사
- javascript redirection
- 타임피커
- 하드 윈도우 복사
- 맥 오라클설치
- 말줄임표시
웹개발자의 기지개
[javascript] PDF 자동 로딩 - pdf.js 소스 연동하기 (모바일,pc 자동로딩) 본문
[javascript] PDF 자동 로딩 - pdf.js 소스 연동하기 (모바일,pc 자동로딩)
http://portfolio.wonpaper.net 2020. 9. 19. 04:25
pc상의 브라우저로 pdf 파일을 자동로딩을 할때,
<iframe src="test.pdf"></iframe> 형식으로 한다면,
크롬에서는 자동 로딩이 된다.
IE의 경우, 아크로벳 리더같은 플러그인형태로 설치가 되어 있어야 브라우저 상으로 자동로딩이 된다.
그런데, 문제는 모바일상으로 바로 PDF 파일을 로딩하고 싶을때이다.
이럴때 유용하게 쓸 수 있는 오픈소스가 pdf.js 이다.
PDF.js
PDF.js A general-purpose, web standards-based platform for parsing and rendering PDFs. Download Demo GitHub Project
mozilla.github.io
mozilla.github.io/pdf.js/getting_started/#download
Getting Started
Getting Started An introduction to PDF.js with examples. Introduction Before downloading PDF.js please take a moment to understand the different layers of the PDF.js project. Layer About Core The core layer is where a binary PDF is parsed and interpreted
mozilla.github.io
위의 다운로드 페이지에서 pdfjs-2.5.207-dist.zip 을 다운받았다.
압축을 풀면
여기에서 web폴더안의 viewer.html 파일과 연동하면 간단히 사용할 수가 있다.
|
1
|
<iframe src="./web/viewer.html?file=2020_guidebook_1.pdf" width="100%" height="920px"></iframe>
|
cs |
'javascript' 카테고리의 다른 글
| [javascript] 남은 시간, 타이머 (0) | 2020.12.03 |
|---|---|
| [javascript] checkbox 전체선택, 전체해제, 선택한 checkbox 내용확인하기 1 (0) | 2020.10.27 |
| [javascript] 네이버지도 연동하기 ( Naver Map ) (0) | 2020.09.11 |
| [javascript] Button 클릭시 submit 되는 현상 막기 (0) | 2020.08.05 |
| [javascript] 로그인 유효성 체크하기 (onsubmit 과 onkeydown) (0) | 2020.07.20 |
