使用 WebODF / Javascript 动态创建 ODT答案

【问题标题】：Dynamically creating ODT using WebODF / Javascript使用 WebODF / Javascript 动态创建 ODT
【发布时间】：2015-05-04 11:18:55
【问题描述】：

使用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 中。

【问题讨论】：

标签： javascript odt webodf

【解决方案1】：

如果我的问题没有错，您想使用 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 框架来设计服务作为后端来保存文件。

【讨论】：

【解决方案2】：

这可能会对您有所帮助。在此示例中，我将从 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;

【讨论】：