Как с помощью js заполнить шаблон Word?

Question

[Goobert Cripto]

Есть готовый шаблон Word, как можно его заполнить на сайте с помощью формы в которую вводятся данные созданной на js? После заполнения формы заполненный шаблон качается с сервера.

Какая библиотека для выполнения данных задач потребуется? Если она там нужна.

Answer 1

[MikhedValery]

В шаблоне docx пометить поля для вставки {field1} {field2} и т.д. закрыть
В вашей программе
docx - открыть как обычный архив, достать из него файл word/document.xml
Подправить заменой как обычный текст. (Сначала с помощью регулярных выражений лишние '<.*?>')

Например я непосредственно в JSzip пробовал

function isprXML(xmlfile) {
            // //почистить шаблон до правильного вида переменных {field1}
            var re = /({.*?})/sg;
            var re2 = /(<.*?>)/g;;
            let result = xmlfile.match(re) || [];
            let newres = [];
            result.forEach(element => {
                var newel = element.replace(re2, "");
                xmlfile = xmlfile.replace(element, newel);
            });
            return xmlfile;
        }

Затем просто менять поля {field1} на ваши данные
xmlfile = xmlfile.replace("field1", data);

word/document.xml - Положить обратно в архив

Здесь пример на JS - работает прямо в браузере

Comments

[TuMko]

Можно ли как-то загружать файл шаблона .docx не из инпута, а сразу из директории проекта?

[MikhedValery]

Сделать это всй на стороне сервера. (Примерно тоже самое на node js, PHP ...)
Здесь был показан только логика. Здесь XML упоминается только потому что так устроен docx, а вся работа идет как с обычным txt. Взять docx, распаковать как обыкновенный архив и подкоректировать как обычный текст, предварительно отмеченные поля очистить от мусора с помощью регулярных выражений
Отмеченные поля в xml выглядят примерно так: {




w:hAnsi="Tahoma"
w:cs="Tahoma"/>




kontragent


w:rsidRPr="0007658A">

w:hAnsi="Tahoma"
w:cs="Tahoma"/>





}, от этого можно оставить только {kontragent}. docx от этого не поломается.
С библотеками для docx гораздо медленнее получалось. А по такому принципу и большие табличные отчеты довольно быстро заполняются.

[ProIvanko]

Можно ли таким же образом на клиенте рендерить docx или конвертировать в pdf и рендерить pdf? Или каким-то иным способом сделать окно предпросмотра готового файла

[MikhedValery]

ProIvanko,
Например я пользую для быстрого предпросмотра документов docx https://github.com/VolodymyrBaydalka/docxjs/
https://github.com/VM1968/myXLSX/blob/main/ExcelTo...
тут есть просмотр docx (шаблона), можно аналогично и результата

Answer 2

[Шохрух Шаймардонов]

Читайте оф.докмелкософта. А так, вот либа на npm