麒麟v10、uos系统在线批量生成pdf文件

注意

本文中展示的代码均为关键代码，复制粘贴到您的项目中，按照实际的情况，例如文档路径，用户名等做适当修改即可使用。

 在实际项目开发中如果遇到批量动态生成PDF文档的需求，只需参考后台批量生成PDF文档，目前网上也有一些针对此需求的方案，如果您想要了解这些方案的对比，请查看后台生成单个Word文档中的“方案对比”。

如果只是需要批量转PDF文件，那么也可以使用PageOffice提供的FileMaker组件来实现，与“后台批量生成PDF文档”不同的地方仅是：批量转PDF文件不需要WordDocumentWriter对象动态填充数据的代码。所以批量转PDF文件也只需两步即可实现：

  1. 调用FileMakerCtrl对象的fillDocumentAsPDF方法实现Word转PDF功能，比如Convert.jsp中调用了此代码； fmCtrl.fillDocumentAsPDF("doc01.doc", DocumentOpenType.Word, "doc01.pdf");
  2. 调用PageOffice提供的jsCallFileMaker函数，递归执行Convert.jsp实现批量转PDF文件功能，比如执行下面的ConvertFiles()，递归调用ConvertFile函数，把ids数组中包含的所有Word文件转为pdf。 
    1. var ids = [1, 2, 3, 5]; //比如这是Word文件在数据库中的id
    2.  
    3. function ConvertFiles() {
    4. 	ConvertFile(ids, 0); 
    5. }
    6.  
    7. function ConvertFile(idArr, index) {
    8. 	filemakerctrl.SaveFilePage = "/FileMakerConvertPDFs/SaveFile.jsp?id=" + idArr[index];
    9. 	filemakerctrl.CallFileMaker({
    10. 		url: "/FileMakerConvertPDFs/Convert.jsp?id="+idArr[index], //把指定id的word文件转pdf
    11. 		success: function (customSaveResult) {
    12. 			console.log("completed successfully.");
    13. 			index++;
    14. 			
    15. 			if(index < idArr.length){
    16. 				ConvertFile(idArr, index);
    17. 			} 
    18. 		},
    19. 		progress: function (pos) {
    20. 			console.log("running "+pos+"%");
    21. 		},
    22. 		error: function (msg) {
    23. 			console.log("error occurred: "+msg);
    24. 		}
    25. 	});
    26. }

    FileMakerCtrl 和 PageOfficeCtrl 的区别

    FileMakerCtrl 本质上就是一个没有界面的 PageOfficeCtrl，也是调用客户端 Office 程序处理文件的，都可以实现对文档进行动态填充、动态转 PDF 等功能，唯一的区别就是 FileMakerCtrl 在线打开填充和转换文档的时候，客户端页面不打开显示文档内容，而 PageOfficeCtrl 会打开显示文档内容。

后端代码

  1. 调用FileMakerCtrl对象实现Word转pdf，比如后端/convert方法的代码如下： 
    1. String id = request.getParameter("id").trim();
    2. String docName = "doc0" + id + ".doc";
    3. String pdfName = "doc0" + id + ".pdf";
    4.  
    5. FileMakerCtrl fmCtrl = new FileMakerCtrl(request);
    6. fmCtrl.fillDocumentAsPDF("doc/" + docName, DocumentOpenType.Word, pdfName);
    7. out.print(fmCtrl.getHtml());
  2. Word转pdf后，在SaveFilePage属性指向的地址接口中处理文件保存的后台代码如下： 
    1. FileSaver fs = new FileSaver(request, response);
    2. fs.saveToFile(request.getSession().getServletContext().getRealPath("FileMakerConvertPDFs/doc/"+ fs.getFileName()));
    3. fs.setCustomSaveResult("{\"msg\":\"ok\"}");//用于给前端页面返回数据
    4. fs.close();

前端代码

调用PageOffice提供的jsCallFileMaker函数，递归执行/convert实现批量转PDF文件功能的前端页面代码，如下：

  1. <script setup>
  2. import request from '@/utils/request';
  3. import { ref, onMounted } from 'vue'
  4. import { filemakerctrl, POBrowser } from 'js-pageoffice'
  5.  
  6. const titleText = ref('');
  7. const checked = ref(true);
  8. const buttonDisabled = ref(false);
  9. const progressBar1 = ref(null);
  10. const progressBar2 = ref(null);
  11.  
  12. onMounted(async () => {
  13.   try {
  14.     const response = await request({
  15.       url: '/index',
  16.       method: 'get',
  17.     });
  18.     titleText.value = response;
  19.   } catch (error) {
  20.     console.error('Failed to fetch title:', error);
  21.   }
  22. })
  23.  
  24. function selectall() {
  25.   if (checked.value) {
  26.     let obj = document.all.check;
  27.     for (let i = 0; i < obj.length; i++) {
  28.       obj[i].checked = true;
  29.       checked.value = false;
  30.     }
  31.   } else {
  32.     let obj = document.all.check;
  33.     for (let i = 0; i < obj.length; i++) {
  34.       obj[i].checked = false;
  35.       checked.value = true;
  36.     }
  37.   }
  38. }
  39.  
  40. function ConvertFiles() {
  41.   let ids = [];
  42.   let checkboxes = document.getElementsByName("check");
  43.  
  44.   for (let i = 0; i < checkboxes.length; i++) {
  45.     if (checkboxes[i].checked) {
  46.       ids.push(checkboxes[i].value);
  47.     }
  48.   }
  49.  
  50.   if (0 == ids.length) {
  51.     alert("请至少选择一个文档");
  52.     return;
  53.   }
  54.  
  55.   buttonDisabled.value = true;
  56.   ConvertFile(ids, 0);
  57. }
  58.  
  59. function ConvertFile(idArr, index) {
  60.   // 设置用于保存文件的服务器端controller地址,该地址需从"/"开始，指向服务器端根目录  
  61.   /** 如果想要给SaveFilePage传递多个参数，建议使用new URLSearchParams方式，例如：
  62. * let saveFileUrl = "/FileMakerConvertPDFs/save";
  63. * let paramValue = new URLSearchParams({id:1,name:"张三"});
  64. * filemakerctrl.SaveFilePage = `${saveFileUrl}?${paramValue.toString()}`;
  65. */
  66.   filemakerctrl.SaveFilePage = "/FileMakerConvertPDFs/save?id=" + idArr[index];
  67.   filemakerctrl.CallFileMaker({
  68.     // url：指向服务器端FileMakerCtrl打开文件的controller地址，该地址需从"/"开始，指向服务器端根目录  
  69.     url: "/FileMakerConvertPDFs/convert?id=" + idArr[index],
  70.     success: (res) => {//res:获取服务器端fs.setCustomSaveResult设置的保存结果
  71.       console.log(res);
  72.       console.log("completed successfully.");
  73.       setProgress1(100);
  74.       index++;
  75.       setProgress2(index, idArr.length);
  76.       if (index < idArr.length) {
  77.         ConvertFile(idArr, index);
  78.       }
  79.     },
  80.     progress: (pos) => {
  81.       console.log("running " + pos + "%");
  82.       setProgress1(pos);
  83.     },
  84.     error: (msg) => {
  85.       console.log("error occurred: " + msg);
  86.     },
  87.   });
  88. }
  89.  
  90. function setProgress1(percent) {
  91.   progressBar1.value.style.width = percent + "%";
  92.   progressBar1.value.innerText = percent + "%";
  93. }
  94.  
  95. function setProgress2(index, count) {
  96.   progressBar2.value.style.width = Math.round((index / count) * 100) + "%";
  97.   progressBar2.value.innerText = index + "/" + count;
  98. }
  99.  
  100. </script>
  101.  
  102. <template>
  103.   <div class="Word">
  104.     <div style="margin: 100px" align="center">
  105.       <h2>演示：批量转PDF</h2>
  106.       <div style="width: 600px; margin: 0 auto; font-size: 14px">
  107.         <p style="text-align: left">
  108.           操作说明：<br />
  109.           1. 勾选下面的文件；<br />
  110.           2. 点击“批量转换PDF文档”按钮；<br />
  111.           3.生成完毕后，即可在“FileMakerConvertPDFs/doc”目录下看到批量生成的PDF文件。<br />
  112.         </p>
  113.       </div>
  114.       <h3>文件列表</h3>
  115.       <table id="table1">
  116.         <tr>
  117.           <th>
  118.             <input name="checkAll" type="checkbox" @click="selectall()" />
  119.           </th>
  120.           <th>序号</th>
  121.           <th>文件名</th>
  122.         </tr>
  123.         <tr>
  124.           <td><input name="check" type="checkbox" value="1" /></td>
  125.           <td>01</td>
  126.           <td>PageOffice产品简介</td>
  127.         </tr>
  128.         <tr>
  129.           <td><input name="check" type="checkbox" value="2" /></td>
  130.           <td>02</td>
  131.           <td>PageOffice产品安装步骤</td>
  132.         </tr>
  133.         <tr>
  134.           <td><input name="check" type="checkbox" value="3" /></td>
  135.           <td>03</td>
  136.           <td>PageOffice产品应用领域</td>
  137.         </tr>
  138.         <tr>
  139.           <td><input name="check" type="checkbox" value="4" /></td>
  140.           <td>04</td>
  141.           <td>PageOffice产品对环境的要求</td>
  142.         </tr>
  143.       </table>
  144.  
  145.       <input type="button" id="Button1" :disabled="buttonDisabled" value="批量转换PDF文档" @click="ConvertFiles()" />
  146.  
  147.       <div id="progressDiv">
  148.         单文件进度：
  149.         <div class="progressBarContainer">
  150.           <div id="progressBar1" ref="progressBar1" class="progressBar"></div>
  151.         </div>
  152.         整体进度：
  153.         <div class="progressBarContainer">
  154.           <div id="progressBar2" ref="progressBar2" class="progressBar"></div>
  155.         </div>
  156.       </div>
  157.     </div>
  158.   </div>
  159. </template>
  160.  
  161. <style scoped>
  162. h3 {
  163.   display: block;
  164.   font-size: 1.17em;
  165.   margin-block-start: 1em;
  166.   margin-block-end: 1em;
  167.   margin-inline-start: 0px;
  168.   margin-inline-end: 0px;
  169.   font-weight: bold;
  170. }
  171. h2 {
  172.   display: block;
  173.   font-size: 1.5em;
  174.   margin-block-start: 0.83em;
  175.   margin-block-end: 0.83em;
  176.   margin-inline-start: 0px;
  177.   margin-inline-end: 0px;
  178.   font-weight: bold;
  179. }
  180. table {
  181.   border: solid 1px #ccc;
  182.   width: 600px;
  183.   margin: 20px;
  184. }
  185. th {
  186.   border-bottom: solid 1px #ccc;
  187.   text-align: left;
  188.   padding: 5px;
  189. }
  190. td {
  191.   padding: 5px;
  192. }
  193. .progressBarContainer {
  194.   width: 100%;
  195.   background-color: #eee;
  196.   border-radius: 5px;
  197.   padding: 3px;
  198.   box-shadow: 2px 2px 3px 3px #ccc inset;
  199. }
  200. .progressBar {
  201.   height: 20px;
  202.   width: 0%;
  203.   background-color: #1a73e8;
  204.   border-radius: 5px;
  205.   text-align: center;
  206.   line-height: 20px;
  207.   color: white;
  208. }
  209. #progressDiv {
  210.   width: 400px;
  211.   margin: 10px auto;
  212.   text-align: left;
  213.   font-size: 14px;
  214.   border: solid 1px #1a73e8;
  215.   padding: 10px 20px;
  216.   color: #1a73e8;
  217. }
  218. </style>

 参考链接：批量转PDF文件 | PageOffice 开发者中心

 

posted @ 2025-07-03 14:12  爱吃苹果皮  阅读(67)  评论(0)    收藏  举报