使用 WebODF 动态创建 ODT / Javascript

Question

使用 javascript，我需要创建一个 .odt 文件并使用 javascript 变量中的数据填充内容。我发现唯一可行的是 WebODF。一个看起来与之相似的例子是 here.

当我尝试使用 pdfkit（使用节点）做类似于 PDF 的事情时，我可以做这样的事情：

PDFDocument = require('pdfkit');
var doc = new PDFDocument();
doc.pipe(fs.createWriteStream(fileName));
doc.text("Fist line");
doc.text("Second line");

是否可以使用 WebODF 做类似的事情？我找到了 ops.OpInsertText，但我不确定如何使用它来实际插入文本。

同样，理想的解决方案只在 javascript。

Answer 1

这可能会有所帮助 you.In 这个例子我将从 promt 返回的值附加到 webodf 内的光标位置。您可以类似地将数据插入到任何其他元素 offest()。按 crtl+space 会显示一个提示符，我们在那里输入的任何内容都会插入到 odf.

function insertBreakAtPoint(e) {
    var range;
    var textNode;
    var offset;
    var key = prompt("Enter the JSON Key", "name");
    {% raw %}
    var key_final = '{{address.'+key+'}}';
    {% endraw %} 

    var caretOverlay=$('.webodf-caretOverlay').offset();
    if (document.caretPositionFromPoint) {
        range = document.caretPositionFromPoint(
            caretOverlay.left, caretOverlay.top
        );
        textNode = range.offsetNode;
        offset = range.offset;
    } else if (document.caretRangeFromPoint) {
        range = document.caretRangeFromPoint(
            caretOverlay.left, caretOverlay.top
        );
        textNode = range.startContainer;
        offset = range.startOffset;
    }

    #only split TEXT_NODEs
    if (textNode.nodeType == 3) {
        var replacement = textNode.splitText(offset);
        var keynode = document.createTextNode(key_final);
        textNode.parentNode.insertBefore(keynode, replacement);
    }
}

function KeyPress(e) {
    var evtobj = window.event? event : e
    if (evtobj.keyCode == 32 && evtobj.ctrlKey) 
        insertBreakAtPoint();
}

document.onkeydown = KeyPress;

Answer 2

如果我答对了你的问题，你想使用 JavaScript 变量中的数据动态创建一个新文件。

您可以参考 this answer 以字节数组的形式从 javascript 变量加载文件。这将使您起床并运行一个 odt 文件，您可以将其保存到所需位置。

function saveByteArrayLocally(error, data) {
    var mime = "application/vnd.oasis.opendocument.text";
    var blob = new Blob([data.buffer], {type: mime});

    var res = $http({
        method: 'POST', url: myWebServiceUrl,
        headers: {'Content-Type': undefined},
        data: blob
    });

    res.success(function(data, status, headers, config) {
        console.log(status);
    });
}

注意：您可以使用multer，express.js框架将服务设计为后端来保存文件。

使用 WebODF 动态创建 ODT / Javascript

Dynamically creating ODT using WebODF / Javascript

javascript

odt

webodf