一.需求背景
需求:EKP V16,对于附件打印 开发者一般情况下使用的是 请求直接预览打印 ,但是对于 需要自定义打印文件的大小 需要特别定制!
方案:使用 PDF.js 在 JSP 页面中显示 PDF 文件(EKPV16 项目中已引入 PDF.js 库)
定制前效果:
定制后效果:
二.Code
其中附件链接 可以是请求直接预览打印 或者 附件实际地址
<div id="pdf-container"></div><script>// PDF 文件的 URLconst pdfUrl = "${pageContext.request.contextPath}/path/to/your/file/example.pdf";// 加载 PDF 文件pdfjsLib.getDocument(pdfUrl).promise.then(function(pdf) {console.log('Number of pages: ' + pdf.numPages);// 渲染第一页pdf.getPage(1).then(function(page) {const scale = 1.5;const viewport = page.getViewport({ scale: scale });// 创建 canvas 元素const container = document.getElementById('pdf-container');const canvas = document.createElement('canvas');container.appendChild(canvas);const context = canvas.getContext('2d');canvas.height = viewport.height;canvas.width = viewport.width;// 渲染 PDF 页面const renderContext = {canvasContext: context,viewport: viewport};page.render(renderContext);});}).catch(function(error) {console.error('Error loading PDF: ', error);});</script>