【问题标题】：Use WebODF editor for localhost对 localhost 使用 WebODF 编辑器
【发布时间】：2014-05-06 18:12:33
【问题描述】：

如何在本地主机上添加WebODF？

我试图保存网页并在浏览器中打开，但它失去了格式，一切都搞砸了。

【问题讨论】：

标签： javascript

【解决方案1】：

我是从您实际提供的link 那里得到的：

如何获取 WebODF 去 WebODF.org 看看是否已经有一个满足您需求的版本

直接在你的应用商店搜索

或者下载 WebODF 的源代码，用它创建你自己的应用程序。

这是源代码的链接：https://github.com/kogmbh/WebODF/archive/master.zip

更新

嗯，你很幸运，因为我使用的是基于 Ubuntu 的 Linux 发行版。以下是安装步骤：

创建 webodf.js
webodf.js 是使用闭包编译器编译的。这个编译器压缩所有 JavaScript 文件，使它们更小并执行快点。 CMake 用于设置构建系统，因此 webodf.js 可以创建如下：

sudo apt-get install cmake cmake-gui
sudo apt-get install git
git clone https://github.com/kogmbh/WebODF.git webodf
mkdir build
cd build
cmake ../webodf
make webodf.js-target 这些命令不需要安装任何程序
您可以复制上面的命令（斜体），并将它们粘贴到终端（CTRL + ALT + T），如果一切运行成功，您应该在您的主目录中找到文件夹build。打开它，你应该找到文件夹 webodf... 再次打开它，在那里，你应该找到 webodf.js 文件或类似的东西... 将它放在与 HTML 文件相同的目录中到你的<head> 标签：

<script src = "webodf.js" type="text/javascript" charset="utf-8"></script>

然后您可以按照here 的描述使用 WebODF。

更新 2

我相信你只需要以下程序：git和cmake，反正如果你需要其他的，安装就行了，网上有很多说明。
要加载文件，请使用此 JavaScript：

var odfelement = document.getElementById("odf"); 
/*
you should have a container with the id "odf"
For exmaple a <div>
*/
odfcanvas = new odf.OdfCanvas(odfelement);
odfcanvas.load("myfile.docx"); // the filename (don't forget the extension)

这里是我们文档的容器，这里我们使用名为“odf”的div... 使用容器不是必需的，例如 JavaScript 中的 odfelement 变量可能只是我们的主体：var odfelement = document.getElementsByTagName('body')[0];，但会产生更清晰、无错误的代码......此外，我只假设你可以这样做，所以保持安全并使用前一种方式。

<div id="odf"></div>

注意

别忘了像我之前说的那样添加webodf的脚本：

<script src="webodf.js" type="text/javascript" charset="utf-8"></script>

【讨论】：

那个链接...那个编辑器在那里工作得很好。我想知道如何嵌入本地部署的网站？
@UmairAyub 你从我给你的链接下载源代码，就像下载编辑器的代码一样……然后你可以手动将它嵌入到你的代码中……
它不仅仅是下载。我正在使用 Ubuntu，我必须使用 CMAKE 安装，但不知道如何
感谢您的努力。还有一个问题。我是否需要安装所有这些东西才能使 WebODF 运行？ webodf.org/tools/index.html#compiler
还是只有 CMake？打开文件进行编辑的代码是什么？

【解决方案2】：

在 0.5 版本中，创建和部署简单 WebODF 编辑器的便利性得到了显着改善，不再需要从源代码下载和编译。

有关新的 Wodo 编辑器组件的信息可以在以下位置找到：http://webodf.org/news/2014-06-30.html

使用说明包含在可下载的存档中，或者可以在线查看：https://github.com/kogmbh/WebODF/blob/master/programs/editor/HOWTO-wodotexteditor.md

【讨论】：