在實際項目開發中經常會遇到後臺動態生成文檔的需求，目前網上有一些針對此需求的方案，如果您想要了解這些方案的對比，請查看後臺生成單個Word文檔中的“方案對比”。
如果一次只生成一份文檔，請參考後臺生成單個Word文檔；如果想要一次批量生成很多文檔，那就需要使用PageOffice提供的 js 內置函數CallFileMaker循環調用FileMaker生成文檔的功能，實現批量生成文檔的效果，下面就以“批量生成榮譽證書”的需求爲例，介紹一下如何使用FileMaker批量生成文檔的功能。
-
需求效果：用戶在頁面上勾選要生成榮譽證書的公司名，然後點擊批量生成的按鈕，就可以把各個公司的信息動態填充到榮譽證書模板中，爲每個公司生成一份榮譽證書文件。
-
榮譽證書模板如下圖所示，爲了簡單起見，模板中只使用了公司名稱來代表公司的所有信息，所以只用了一個數據區域“PO_company”來標記公司名稱的位置。
![image]()
-
爲了簡單起見，下面介紹一下批量生成兩份榮譽證書的過程。比如用戶勾選了公司列表的前兩個公司後，點擊批量生成Word文件的按鈕，如下圖所示。
![image]()
-
點擊按鈕後，重複調用把公司信息動態填充到Word模板中生成榮譽證書的後臺代碼（比如：FileMaker.jsp），直到所有的榮譽證書文件都生成完畢。具體實現請參考下面的前端代碼。如下圖所示的兩份榮譽證書，就是在服務器端文件夾下批量生成的兩份Word文件：maker1.doc、maker2.doc。
![image]()
FileMakerCtrl 和 PageOfficeCtrl 的區別
FileMakerCtrl 本質上就是一個沒有界面的 PageOfficeCtrl，也是調用客戶端 Office 程序處理文件的，FileMakerCtrl和PageOfficeCtrl都可以實現對文檔進行動態填充、動態轉 PDF 等功能，唯一的區別就是 FileMakerCtrl 在線打開填充和轉換文檔的時候，Web頁面不會打開顯示文檔內容，而 PageOfficeCtrl 會彈出窗口打開顯示文檔內容。
後端代碼
- 在後端編寫代碼實現文檔動態填充，比如FileMaker.jsp中關鍵代碼如下：
String[] companyArr = {" ", "微軟（中國）有限公司", "IBM（中國）服務有限公司",
"亞馬遜貿易有限公司", "臉書科技有限公司", "谷歌網絡有限公司",
"英偉達技術有限公司","臺積電科技有限責任公司", "沃爾瑪股份有限公司"};
int id = Integer.parseInt(request.getParameter("id"));
FileMakerCtrl fmCtrl = new FileMakerCtrl(request);
WordDocument doc = new WordDocument();
//給數據區域賦值，即把數據填充到模板中相應的位置
doc.openDataRegion("PO_company").setValue(companyArr[id]);
fmCtrl.setSaveFilePage("SaveMaker.jsp?id=" + id);
fmCtrl.setWriter(doc);
fmCtrl.fillDocument("doc/template.doc", DocumentOpenType.Word);
- 在SaveFilePage屬性指向的地址接口中（比如：SaveMaker.jsp），創建FileSaver對象處理文件的保存工作
String id = request.getParameter("id");
FileSaver fs = new FileSaver(request, response);
String fileName = "maker" + id + fs.getFileExtName();
fs.saveToFile(request.getSession().getServletContext().getRealPath("FileMaker/doc") + "/" + fileName);
fs.close();
前端代碼
編寫前端網頁代碼，實現批量生成文件的效果。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title></title>
<script type="text/javascript">
var ids = [1,2]; //假設這就是用戶勾選的兩個公司的id
function ConvertFiles() {
document.getElementById("Button1").disabled = true;
//啓動批量生成文件，0：表示從第一個開始生成。通過遞歸調用ConvertFile完成批量生成文件。
ConvertFile(ids, 0);
}
function ConvertFile(idArr, index) {
CallFileMaker({
url: "FileMaker.jsp?id="+idArr[index], // FileMaker.jsp就是實現單個文件轉換
success: function () {
setProgress1(100);
index++;
setProgress2(index, idArr.length);
if(index < idArr.length){
ConvertFile(idArr, index);
}
},
progress: function (pos) {
setProgress1(pos);
},
error: function (msg) {
document.getElementById("errorMsg").innerHTML = "發生錯誤: <br /> " + msg;
console.log("error occurred: "+msg);
}
});
}
function setProgress1(percent) {
var progressBar = document.getElementById("progressBar1");
progressBar.style.width = percent + '%';
progressBar.innerText = percent + '%';
}
function setProgress2(index, count) {
var progressBar = document.getElementById("progressBar2");
progressBar.style.width = Math.round(index/count*100) + '%';
progressBar.innerText = index + '/' + count;
}
</script>
<style>
.progressBarContainer {
width: 100%;
background-color: #eee;
border-radius: 5px;
padding: 3px;
box-shadow: 2px 2px 3px 3px #ccc inset;
}
.progressBar {
height: 20px;
width: 0%;
background-color: #1A73E8;
border-radius: 5px;
text-align: center;
line-height: 20px;
color: white;
}
#progressDiv{
width:400px;
margin: 10px auto;
text-align: left;
font-size:14px;
border: solid 1px #1A73E8;
padding:10px 20px;
color: #1A73E8;
}
#errorMsg{
color: red;
}
</style>
</head>
<body>
<div style="text-align: center;">
<h3>演示：填充數據到模板中批量生成word文件</h3>
<input id="Button1" type="button" value="批量生成Word文件" onclick="ConvertFiles()"/><br/>
<div id="progressDiv">
單文件進度：
<div class="progressBarContainer">
<div id="progressBar1" class="progressBar"></div>
</div>
整體進度：
<div class="progressBarContainer">
<div id="progressBar2" class="progressBar"></div>
</div>
<div id="errorMsg"> </div>
</div>
</div>
</body>
</html>