前言

最近接到一个需求,实现上传一个word文档,然后将该word转换成html丢给服务端存上。进行技术调研后发现有三种方法可以实现这个功能:ActiveXObjectdocx2htmlmammoth

IE的 ActiveXObject

    var oWordApp=new   ActiveXObject("Word.Application");
var oDocument=oWordApp.Documents.Open("C://test.doc");
oDocument.SaveAs("C://test.html", 10)

缺点:只有IE才有这个东西

docx2html

Git地址:https://github.com/lalalic/docx2html

使用方法:

// html 部分
<input type="file" @change="handleFileSelect">
<textarea id="text"></textarea> // js部分
handleFileSelect(event){
require("docx2html")(event.target.files[0]).then(function(converted){
console.log(converted)
document.querySelector('textarea').value=converted.toString()
})
}

缺点:只能将简单的docx文件转化成html,复杂点的就报错了,如图:

mammoth.js

Git地址:https://github.com/mwilliamson/mammoth.js

中文文档地址:https://www.helplib.com/GitHub/article_106969

使用方法:

    //html:部分
<div class="container">
<input id="document" type="file" @change="handleFileSelect" />
<div class="row">
<div class="span8">
<div id="output" class="well">
</div>
</div>
<div class="span4">
<h3>Messages</h3>
<div id="messages">
</div>
</div>
</div>
</div> //js:部分
handleFileSelect(event) {
this.readFileInputEventAsArrayBuffer(event, (arrayBuffer) => {
mammoth.convertToHtml({arrayBuffer: arrayBuffer})
.then(this.displayResult)
.done();
});
}, displayResult(result) {
console.log(result)
document.getElementById("output").innerHTML = result.value; var messageHtml = result.messages.map((message) => {
return '<li class="' + message.type + '">' + this.escapeHtml(message.message) + "</li>";
}).join(""); document.getElementById("messages").innerHTML = "<ul>" + messageHtml + "</ul>";
}, readFileInputEventAsArrayBuffer(event, callback) {
var file = event.target.files[0]; var reader = new FileReader(); reader.onload = function(loadEvent) {
var arrayBuffer = loadEvent.target.result;
callback(arrayBuffer);
}; reader.readAsArrayBuffer(file);
}, escapeHtml(value) {
return value
.replace(/&/g, '&amp;')
.replace(/"/g, '&quot;')
.replace(/</g, '&lt;')
.replace(/>/g, '&gt;');
},

缺点:只支持docx的word文档,并且转换后的标题没有居中,如图:

js实现word转换为html的更多相关文章

  1. 在Ubuntu环境把PPT和Word转换为swf文件

    项目需要一个在线浏览文档的功能,于是参照网上的代码写了一份利用Microsoft Office 2010和swftools-2013-04-09-1007.exe转换的程序 思路:调用电脑本机的off ...

  2. winform实现word转换为PDF(.doc)

    注意:实现word转换为PDF文件,本人安装Office为2013; word以后缀为.doc为例实现文件类型转换,具体方式如下所示: 实现步骤: 1.添加命名空间引用——using Microsof ...

  3. 使用poi将word转换为html

    使用poi将word转换为html,支持doc,docx,转换后可以保持文字.表格.图片.样式 演示地址: https://www.xiaoyun.studio/app/preview.html 完整 ...

  4. Word转换为图片PDF

    1.        Word转换为PDF,程序很多,但转换后的PDF,还可以复制,虽可以加密禁止复制,但市场上太多的PDF,还可以把PDF转换Word等其他格式,很容易被别人利用和剽窃,即便是PDF加 ...

  5. Js使用word书签填充内容

    Js使用word书签填充内容 1.在模板文件中需要填充的地方插入书签 填充内容为:(|光标所在处) 填写书签名,点击添加完成: 2.使用js打开模板,获取书签位置,填充数据: function pri ...

  6. js中字符串转换为数值的两种方法的区别

    在js中字符串转换为数值的方法有三种:转换函数,强制类型转换,隐式转换 1.转换函数 parseInt()   //将字符串转换为整型 parseFloat()  //将字符串转换为浮点型 转换函数在 ...

  7. C#,VB.NET如何将Word转换为PDF和Text

    众所周知,Word是我们日常工作中常用的办公软件之一,有时出于某种需求我们需要将Word文档转换为PDF以及Text.那么如何以C#,VB.NET编程的方式来实现这一功能呢? 下面我将分开介绍如何运用 ...

  8. Word转换为markdown

    Word转换为markdown 首先你的电脑要有office word 1   安装pandoc https://github.com/jgm/pandoc/releases,可以找到最新的pando ...

  9. UiPath之Word转换为PDF

    前几天在手机上看到其他的文章,里面提到如何将Word转换为PDf,在UiPath的ManagePackage中,下载一个WordToPDF的包, 我按照上面的方法试着做了一下,但是在转换的时候很不稳定 ...

随机推荐

  1. linux----------yum一些安装命令汇总

    1.yum install -y psmisc        安装killall命令 2.yum install -y lrzsz        安装sz(下载)和rz(上传)命令 3.yum ins ...

  2. cycle标签和random两种方式美化表格

    一:cycle标签实现给表格变色 1. <style>标签里写好需要的颜色 2. 在要变色的地方(行/列)加固定的语句,按照顺序依次执行 代码: <!DOCTYPE html> ...

  3. redis maxheap 51200000

    Redis无法启动 今天在启动Redis时提示以下错: C:\Java\redis2817>redis-server.exe redis.windows.conf [5268] 23 Apr 1 ...

  4. SpringBoot缓存之redis--最简单的使用方式

    第一步:配置redis 这里使用的是yml类型的配置文件 mybatis: mapper-locations: classpath:mapping/*.xml spring: datasource: ...

  5. IT题库3-线程实现的方式

    1.继承Thread类创建线程 Thread类本质上是实现了Runnable接口的一个实例,代表一个线程的实例.启动线程的唯一方法就是通过Thread类的start()实例方法.start()方法是一 ...

  6. 【融云分析】如何实现分布式场景下唯一 ID 生成?

    ◀背景▶ 对于一套分布式部署的 IM 系统,要求每条消息的 ID 要保证在集群中全局唯一且按生成时间有序排列.如何快速高效的生成消息数据的唯一 ID ,是影响系统吞吐量的关键因素.那么,融云是如何做到 ...

  7. 清除Windows 10的文件夹浏览痕迹

    windows 10有一个功能就是在快速访问时显示“最近访问的文件”,“常用文件”.如果是一台共用电脑,这个功能会经常暴露自己的“行踪”. 可以在“文件夹选项”-“隐私”中去掉勾选,并点击“清除”来清 ...

  8. vscode中添加git

    步骤: 下载Git客户端 配置环境变量 设置vscode与Git的关联 重启 步骤一: 该网址,下载即可. https://git-scm.com/downloads 步骤二: 计算机 > 属性 ...

  9. go区块链学习教程之iris框架mvc架构

    在Iris框架中,封装了mvc包作为对mvc架构的支持,方便开发者遵循mvc的开发原则进行开发. iris框架支持请求数据.模型.持久数据分层处理,并支持各层级模块代码绑定执行. MVC即:model ...

  10. java个内部类的总结

    内部类的概念 成员内部类 访问成员内部类格式: 案例 局部内部类 案例 静态内部类 访问格式: 案例 匿名内部类 格式: 案例 内部类的概念 将类定义在类的内部,那么该类就成为内部类 注意: 内部类是 ...