前端实现导入PPT在线编辑

主要实现一个在线课件系统，需要对课件进行web的接入和编辑

需求分析：

上传ppt
转换数据，上传完以后，等待端转ppt，然后返回，前端开始数据转换
需要枚举的数据较多，所以拆分了多个方法，分2类，一类是类型的判断处理、另一类是枚举数据处理。
在处理公式的时候，涉及到了异步，使用async/await和promise处理，其中遇到2个坑
1、加了async的方法，返回值始终是一个promise,用resolve(‘return的值’)处理以后，就可以获取到想要的返回值了
2、一开始用的forEach循环，循环里的await不会同步，改成ES6的for…of循环就行了。

实现web端ppt方式

reveal.js，很轻易地使用 HTML 创建一个漂亮的演示文稿的框架，Markdown 文稿变成 PPT
Impress.js，采用 CSS3 与 JavaScript 语言完成的一个可供开发者使用的表现层框架(演示工具)
Deck.js
HTML Slide
Presentation
CSSS
Fathom.js

但是和需求不符合，需要实现在线编辑的PPT文稿，并且需要支持ppt格式文件导入成html形式，百度了一下，在线编辑的方式也有很多，都是大公司开发不能嵌入本地开发中

web端在编编辑的方式

腾讯文档
wps.js
Office Online
PageOffice，需要用户下载控件，太麻烦
WebOffice
石墨文档等

功能相对完善，很好使用，但是需要收费并且增加跳转链接到对方网站上使用，不符合项目需要

在线打开并编辑ppt，采用ppt-to-html方式
将ppt转成html格式，
增加webscoket，实时与接口通信，记录当前的对应行为
监听对应的行为，例如双击时对元素增加可编辑属性contenteditable属性设置成true，如果让整个页面都可以编辑，那么页面上的按钮事件也会失效。所以通常会把要编辑的文档放在一个<iframe>元素中，而这个元素就充当了一个超级的编辑框。’
拖动元素时增加拖拽属性draggable=“true”，并监听对应的相关信息，位置宽高等

前端实现导入PPT在线编辑相关推荐

在前端实现excel导入，在线编辑，导出，打印等功能
后台实现excel的导入导出很简单,在线编辑通过使用第三方平台集成也不复杂,那怎么在前端实现exel导入导出.打印.在线编辑功能呢? 在此,我们需要知道几个第三方库:luckySheet,luckyE ...
docker onlyoffice7.1.1 word excel ppt在线编辑、在线预览_添加中文字体和中文字号_02
文章目录一. onlyoffice添加中文字体 1. 下载字体 2. 上传字体 3. 删除原版自带字体 4. 字体复制 5. 安装字体 6. 重启容器 7. 清除缓存 8. 效果验证二. only ...
vue中使用Luckysheet实现Excel的导入、在线编辑、导出等功能
一.准备阶段 1.在pubilic文件夹下的index.html文件中的head标签中引入Luckysheet的cdn文件 <link rel='stylesheet' href='https: ...
office在线编辑ONLYOFFICE集成java和前端
准备: onlyoffice/documentServer在线编辑保存启动一个documentServer的容器 docker run -it --name documentServer -d -p ...
NTKO 文件在线编辑并保存目前平台板plus支持 word excel ppt
以下是本人在开发过程中使用NTKO 控件进行在线打开文件并针对 word excel ppt 文件在线编辑,编辑之后保存.使用控件里的保存功能第一步: 在这之前您的jsp或者js文件中已经使用o ...
Vue实现在线编辑excel、导入、导出
文章目录概要整体架构流程小结概要 Vue实现在线编辑excel.导入.导出整体架构流程 luckysheet文档地址 exceljs文档地址 1.npm安装依赖 npm i exceljs ...
vue集成Luckyexcel实现在线编辑Excel，可自行导入，也可从服务器端获取
安装依赖 npm install luckyexcel 在页面中引入 import LuckyExcel from 'luckyexcel' html中 <div id="lucky ...
html 在线查看ppt,跨平台HTML在线编辑.ppt
在线页面编辑系统 2010年浙江理工大学毕业论文答辩 2002级软件工程指导老师:吴小竹.丁善镜福州大学计算机科学与技术系 2006年6月11日课题背景随着互联网技术的迅速发展,各种WEB应 ...
前端智能化实践（附：D2 前端技术论坛 PPT 合集）
大家好,我们是来自阿里巴巴淘系技术部的狼叔.卓风.感谢 D2 组委会,让我们有机会在这里分享,关于<前端智能化实践-- P2C 从需求文档生成代码>. 淘系技术微信公众号后台回复「D2」即 ...

前端实现导入PPT在线编辑

前端实现导入PPT在线编辑相关推荐

最新文章

热门文章