js实现word转换为html
前言
最近接到一个需求,实现上传一个word文档,然后将该word转换成html丢给服务端存上。进行技术调研后发现有三种方法可以实现这个功能:ActiveXObject
、docx2html
、mammoth
。
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, '&')
.replace(/"/g, '"')
.replace(/</g, '<')
.replace(/>/g, '>');
},
缺点:只支持docx的word文档,并且转换后的标题没有居中,如图:
js实现word转换为html的更多相关文章
- 在Ubuntu环境把PPT和Word转换为swf文件
项目需要一个在线浏览文档的功能,于是参照网上的代码写了一份利用Microsoft Office 2010和swftools-2013-04-09-1007.exe转换的程序 思路:调用电脑本机的off ...
- winform实现word转换为PDF(.doc)
注意:实现word转换为PDF文件,本人安装Office为2013; word以后缀为.doc为例实现文件类型转换,具体方式如下所示: 实现步骤: 1.添加命名空间引用——using Microsof ...
- 使用poi将word转换为html
使用poi将word转换为html,支持doc,docx,转换后可以保持文字.表格.图片.样式 演示地址: https://www.xiaoyun.studio/app/preview.html 完整 ...
- Word转换为图片PDF
1. Word转换为PDF,程序很多,但转换后的PDF,还可以复制,虽可以加密禁止复制,但市场上太多的PDF,还可以把PDF转换Word等其他格式,很容易被别人利用和剽窃,即便是PDF加 ...
- Js使用word书签填充内容
Js使用word书签填充内容 1.在模板文件中需要填充的地方插入书签 填充内容为:(|光标所在处) 填写书签名,点击添加完成: 2.使用js打开模板,获取书签位置,填充数据: function pri ...
- js中字符串转换为数值的两种方法的区别
在js中字符串转换为数值的方法有三种:转换函数,强制类型转换,隐式转换 1.转换函数 parseInt() //将字符串转换为整型 parseFloat() //将字符串转换为浮点型 转换函数在 ...
- C#,VB.NET如何将Word转换为PDF和Text
众所周知,Word是我们日常工作中常用的办公软件之一,有时出于某种需求我们需要将Word文档转换为PDF以及Text.那么如何以C#,VB.NET编程的方式来实现这一功能呢? 下面我将分开介绍如何运用 ...
- Word转换为markdown
Word转换为markdown 首先你的电脑要有office word 1 安装pandoc https://github.com/jgm/pandoc/releases,可以找到最新的pando ...
- UiPath之Word转换为PDF
前几天在手机上看到其他的文章,里面提到如何将Word转换为PDf,在UiPath的ManagePackage中,下载一个WordToPDF的包, 我按照上面的方法试着做了一下,但是在转换的时候很不稳定 ...
随机推荐
- linux----------yum一些安装命令汇总
1.yum install -y psmisc 安装killall命令 2.yum install -y lrzsz 安装sz(下载)和rz(上传)命令 3.yum ins ...
- cycle标签和random两种方式美化表格
一:cycle标签实现给表格变色 1. <style>标签里写好需要的颜色 2. 在要变色的地方(行/列)加固定的语句,按照顺序依次执行 代码: <!DOCTYPE html> ...
- redis maxheap 51200000
Redis无法启动 今天在启动Redis时提示以下错: C:\Java\redis2817>redis-server.exe redis.windows.conf [5268] 23 Apr 1 ...
- SpringBoot缓存之redis--最简单的使用方式
第一步:配置redis 这里使用的是yml类型的配置文件 mybatis: mapper-locations: classpath:mapping/*.xml spring: datasource: ...
- IT题库3-线程实现的方式
1.继承Thread类创建线程 Thread类本质上是实现了Runnable接口的一个实例,代表一个线程的实例.启动线程的唯一方法就是通过Thread类的start()实例方法.start()方法是一 ...
- 【融云分析】如何实现分布式场景下唯一 ID 生成?
◀背景▶ 对于一套分布式部署的 IM 系统,要求每条消息的 ID 要保证在集群中全局唯一且按生成时间有序排列.如何快速高效的生成消息数据的唯一 ID ,是影响系统吞吐量的关键因素.那么,融云是如何做到 ...
- 清除Windows 10的文件夹浏览痕迹
windows 10有一个功能就是在快速访问时显示“最近访问的文件”,“常用文件”.如果是一台共用电脑,这个功能会经常暴露自己的“行踪”. 可以在“文件夹选项”-“隐私”中去掉勾选,并点击“清除”来清 ...
- vscode中添加git
步骤: 下载Git客户端 配置环境变量 设置vscode与Git的关联 重启 步骤一: 该网址,下载即可. https://git-scm.com/downloads 步骤二: 计算机 > 属性 ...
- go区块链学习教程之iris框架mvc架构
在Iris框架中,封装了mvc包作为对mvc架构的支持,方便开发者遵循mvc的开发原则进行开发. iris框架支持请求数据.模型.持久数据分层处理,并支持各层级模块代码绑定执行. MVC即:model ...
- java个内部类的总结
内部类的概念 成员内部类 访问成员内部类格式: 案例 局部内部类 案例 静态内部类 访问格式: 案例 匿名内部类 格式: 案例 内部类的概念 将类定义在类的内部,那么该类就成为内部类 注意: 内部类是 ...