API JavaScript เพื่อสร้างเอกสาร Word แบบไดนามิก
ไลบรารี JavaScript แบบโอเพนซอร์สสำหรับสร้างเอกสาร Word แบบไดนามิกด้วย Node.js และแอปพลิเคชันบนเบราว์เซอร์
Docx-templates คืออะไร?
Docx-Templates เป็นไลบรารี JavaScript แบบโอเพ่นซอร์สที่ช่วยให้นักพัฒนาซอฟต์แวร์สร้างเอกสาร Microsoft Word (.docx) แบบไดนามิกโดยใช้เทมเพลตที่กำหนดล่วงหน้า แทนการสร้างเอกสาร Word ด้วยตนเองแบบโปรแกรมเมอร์ นักพัฒนาสามารถออกแบบเทมเพลตใน Microsoft Word และใส่ข้อมูลไดนามิกโดยใช้คำสั่งฝังในเทมเพลต ไลบรารีนี้ทำงานได้ทั้งในสภาพแวดล้อม Node.js และเบราว์เซอร์ ทำให้มีความยืดหยุ่นสูงสำหรับแอปพลิเคชันเว็บและเซิร์ฟเวอร์สมัยใหม่ มันประมวลผลไฟล์ DOCX โดยการวิเคราะห์โครงสร้าง XML ภายในและแทนที่คำสั่งเทมเพลตด้วยข้อมูลจริงในขณะรันไทม์.
ไลบรารี Docx-Templates เป็นเครื่องมือโอเพ่นซอร์สที่ทรงพลังออกแบบมาสำหรับสภาพแวดล้อม Node.js และเบราว์เซอร์ ความได้เปรียบหลักของไลบรารีคือการแยกการออกแบบและตรรกะ ผู้ใช้ที่ไม่เชิงเทคนิคสามารถออกแบบเค้าโครงและสไตล์ใน Word ได้ ในขณะที่นักพัฒนามุ่งเน้นการใส่ข้อมูล ไลบรารีรองรับตรรกะซับซ้อนเช่น ลูป, การจัดรูปแบบตามเงื่อนไข, และแม้กระทั่งการรันสคริปต์ JavaScript โดยตรงภายในเอกสาร ซึ่งทำให้เป็นโซลูชันที่เหมาะสำหรับนักพัฒนาที่ต้องการสร้างรายงานคุณภาพสูงโดยไม่ต้องต่อสู้กับ XML หรือเครื่องมือออกแบบที่เป็นกรรมสิทธิ์
เริ่มต้นใช้งาน Docx-templates
วิธีที่แนะนำในการติดตั้งไลบรารี Docx-templates คือผ่าน npm โปรดใช้คำสั่งต่อไปนี้เพื่อการติดตั้งที่ราบรื่น
ติดตั้ง Docx-Templates ผ่าน NPM
$ npm install docx-templates ติดตั้ง Docx-Templates ผ่าน Yarn/strong>
$ yarn add docx-templates การสร้างเอกสารโดยใช้เทมเพลตผ่าน JS API
ไลบรารี Docx-Templates แบบโอเพ่นซอร์สช่วยให้นักพัฒนาซอฟต์แวร์ออกแบบเอกสารใน Word และแทรกข้อมูลแบบไดนามิกโดยใช้คำสั่งง่าย ๆ วิธีการนี้แยกการนำเสนอออกจากตรรกะ ทำให้เทมเพลตง่ายต่อการจัดการและอัปเดตโดยไม่ต้องเปลี่ยนโค้ด คุณสามารถเข้าถึงคุณสมบัติต่าง ๆ จากอ็อบเจกต์ข้อมูลของคุณโดยตรงหรือแม้แต่รันนิพจน์ง่าย ๆ ตัวอย่างเช่น เพื่อแทรกชื่อเต็ม เทมเพลตของคุณจะเป็นดังนี้: {firstName} {surname}. ไลบรารีทำการประเมินโค้ดและแทนที่อย่างราบรื่น.
วิธีสร้างเอกสาร Word อย่างไดนามิกภายในแอป JavaScript?
import createReport from 'docx-templates';
import fs from 'fs';
const template = fs.readFileSync('template.docx');
const report = await createReport({
template,
data: { name: 'John', surname: 'Doe' },
});
fs.writeFileSync('output.docx', report);
การแทรกรูปภาพแบบไดนามิกผ่าน JavaScript
นอกเหนือจากข้อความ ไลบรารี Docx-Templates แบบโอเพ่นซอร์สสามารถแทรกรูปภาพได้ทันที ซึ่งรวมถึงไฟล์ในเครื่อง รูปภาพจาก URL หรือแม้กระทั่ง QR โค้ดที่สร้างโดยโปรแกรม คุณสามารถควบคุมขนาดของรูปภาพและตำแหน่งการวางได้ ฟีเจอร์นี้เป็นการเปลี่ยนเกมสำหรับการสร้างบัตรประจำตัว แคตตาล็อกสินค้า หรือรายงานที่ต้องการแผนภูมิแบบไดนามิกและหลักฐานภาพ นี่คือตัวอย่างง่าย ๆ ที่แสดงวิธีแทรกรูปภาพลงในเอกสาร Word ผ่าน JavaScript API.
วิธีแทรกรูปภาพแบบทันทีภายในเอกสาร Word ผ่าน JavaScript API?
const buffer = await createReport({
template,
data: {
userAvatar: async () => {
const resp = await fetch('https://example.com/photo.png');
return { width: 3, height: 3, data: await resp.arrayBuffer(), extension: '.png' };
}
},
});
// In Word: {IMAGE userAvatar()}
ลูปที่ทรงพลัง (FOR/END-FOR)
การจัดการรายการข้อมูลเป็นเรื่องง่ายด้วยคำสั่ง FOR คุณลักษณะนี้ช่วยให้คุณวนซ้ำผ่านอาร์เรย์เพื่อสร้างแถวตาราง รายการ หรือแม้แต่ส่วนทั้งหมดของเอกสาร ไลบรารี Docx-Templates ได้รวมการสนับสนุนการวนซ้ำแบบซ้อนกันไว้แล้ว ทำให้คุณสามารถแสดงโครงสร้างข้อมูลเชิงลำดับชั้นที่ซับซ้อน เช่น รายชื่อแผนกพร้อมพนักงานของแต่ละแผนก ในขณะที่ยังคงรักษารูปแบบ Word ดั้งเดิม ตัวอย่างโค้ดต่อไปนี้แสดงวิธีทำเช่นนั้น
วิธีใช้ลูปขั้นสูงภายในแอป JavaScript?
const buffer = await createReport({
template,
data: {
projects: [
{ name: 'SEO Optimization', status: 'Completed' },
{ name: 'API Integration', status: 'In Progress' }
]
},
});
/* In Word:
{FOR project IN projects}
Project: {project.name} - Status: {project.status}
{END-FOR}
*/
บริบท JavaScript แบบกำหนดเอง (EXEC)
หนึ่งในคุณสมบัติที่ก้าวหน้าที่สุดของไลบรารี Docx-Templates คือความสามารถในการรันสคริปต์ JavaScript ใด ๆ ด้วยคำสั่ง EXEC (หรือ !) โดยการให้ additionalJsContext คุณสามารถเปิดเผยฟังก์ชันช่วยเหลือแบบกำหนดเองให้กับเทมเพลตได้ ซึ่งทำให้เทมเพลตสามารถทำการคำนวณ ฟอร์แมตวันที่ หรือจัดการสตริงภายในโดยไม่ต้องทำการประมวลผลล่วงหน้าทุกส่วนของข้อมูลในตรรกะแอปพลิเคชันหลักของคุณ
