pdf.js 는 기술 원형 으로 주로 HTML 5 플랫폼 에서 PDF 문 서 를 보 여 주 는 데 사용 되 며 로 컬 기술 지원 이 필요 없습니다.
온라인 프레젠테이션 주소:http://mozilla.github.com/pdf.js/web/viewer.html
PDF.js 홈 페이지 에서 다운로드 가능 주소:http://mozilla.github.io/pdf.js/
압축 을 풀 고 얻 은 build 디 렉 터 리 는 PDF.js 의 핵심 파일 로 안에 있 는 pdf.js 파일 을 직접 가 져 오 면 사용 할 수 있 습 니 다.
html 코드 예제:
 

    
  
     

          
        
        
  
                 

              :  /   
            
                 
                
        
  



  //  pdf.js  

 
pdf 의 미리 보 기 는 위의 canvas 를 통 해 보 여 집 니 다.일반적으로 모 바 일 페이지 는 사용자 크기 를 금지 하지만 모 바 일 페이지 에 흐릿 하 게 표시 되면 크기 를 조정 할 수 있 고 너비 와 높이 등 스타일 은 항목 의 요구 에 따라 조정 할 수 있 습 니 다.
JS 코드 예제:
 

var url = './  .pdf';  //pdf     
  
        PDFJS.workerSrc = '../../build/pdf.worker.js';   //      
            
        var pdfDoc = null,  
            pageNum = 1,  
            pageRendering = false,  
            pageNumPending = null,  
            scale = 0.8,  
            canvas = document.getElementById('the-canvas'),  
            ctx = canvas.getContext('2d');  
            
        function renderPage(num) {  
            pageRendering = true;  
            pdfDoc.getPage(num).then(function(page) {  
            var viewport = page.getViewport(scale);  
            canvas.height = viewport.height;  
            canvas.width = viewport.width;  
            
            var renderContext = {  
                canvasContext: ctx,  
                viewport: viewport  
            };  
            var renderTask = page.render(renderContext);  
            
            renderTask.promise.then(function() {  
                pageRendering = false;  
                if (pageNumPending !== null) {  
                // New page rendering is pending  
                renderPage(pageNumPending);  
                pageNumPending = null;  
                }  
            });  
            });  
            
            document.getElementById('page_num').textContent = pageNum;  
        }  
            
        function queueRenderPage(num) {  
            if (pageRendering) {  
            pageNumPending = num;  
            } else {  
            renderPage(num);  
            }  
        }  
            
        function onPrevPage() {  
            if (pageNum <= 1) {  
            return;  
            }  
            pageNum--;  
            queueRenderPage(pageNum);  
        }  
        document.getElementById('prev').addEventListener('click', onPrevPage);  
            
        function onNextPage() {  
            if (pageNum >= pdfDoc.numPages) {  
            return;  
            }  
            pageNum++;  
            queueRenderPage(pageNum);  
        }  
        document.getElementById('next').addEventListener('click', onNextPage);  
            
        PDFJS.getDocument(url).then(function(pdfDoc_) {  
            pdfDoc = pdfDoc_;  
            document.getElementById('page_count').textContent = pdfDoc.numPages;  
            
            renderPage(pageNum);  
        });