KindEditor自带的上传视频生成的HTML代码为<embed>,在手机端并不支持。于是可以自己在控件里增加生成video标签相关代码。

参考https://www.jianshu.com/p/047198ffed92。。

然而对着修改后没有成功,可能是那里没有改对吧。依然生成的是<embed>。当时由于时间赶,于是用了个简单的办法:

原控件不变的情况下

1、上传的地方修改视频格式。仅上传支持手机格式的

//定义允许上传的文件扩展名
HashMap<String, String> extMap = new HashMap<String, String>();
extMap.put("image", "gif,jpg,jpeg,png,bmp");
extMap.put("flash", "swf,flv");
extMap.put("media", "rmvb,mp4,mpg4,ogg,WebM");//原来支持下面多个格式,现在仅支持手机可以看的几个格式//extMap.put("media", "swf,flv,mp3,wav,wma,wmv,mid,avi,mpg,asf,rm,rmvb,mp4");
extMap.put("file", "doc,docx,xls,xlsx,ppt,htm,html,txt,zip,rar,gz,bz2");
extMap.put("htmlfvideo","swf,flv,mp3,wav,wma,wmv,mid,avi,mpg,asf,rm,rmvb,mp4,ogg,WebM,mpg4");

2、在页面展示的地方,把展示的html富文本中embed直接替换成video。居然好使

var strR= str.replace(/&quot;/g,"'").replace(/embed/g,"video controls");

当然这个方法指标不治本,等回头有空了,再研究一下,直接在控件里生成video的办法。

最后补一个,HTML富文本存数据库和展示的问题。

在网上看了好多各种转义。我的办法是这样的

1、整体不转义传到后台后。把引号替换成对应的形式。然后直接存入数据库

    public static finalString filterHtml(String str){str=str.replaceAll("\"", "&quot;");//str=str.replaceAll("\\&", "&amp;").replaceAll("<", "&lt;").replaceAll("\"", "&quot;").replaceAll(">", "&gt;").replace("'", "&apos;");returnstr;}

2、在数据库的数据形式为

3、展示页面的时候,把富文本数据中对应引号再转义回来

$(function() {var pbArticle = replaceStr1('${pbArticle}');//文章getInfoArticle(pbArticle);//初始化文章
});function getInfoArticle(pbArticle){//初始化文章if(pbArticle!=''){var html = "";var data =JSON.parse(pbArticle);$("#title").html(data.title);$("#pubTime").html(data.pubTime);$("#content").html(data.content);$("#articleId").val(data.id);if("${isColection}"=="0"){//o是1否$("#collectionId").attr("isColection","0");$("#collectionId").attr("src","<%=request.getContextPath() %>/app/fonts/images/star_red.png");}}
}//这里就是转义文章,视频和引号的问题functionreplaceStr1(str){debugger;var strR= str.replace(/&quot;/g,"'").replace(/embed/g,"video controls");var strR1 = strR.replace(/\s+/g,"\ ");var strR2 = strR1.replace(/\\/g,"\\\\");console.info(strR2);/*var json = eval(strR2);*/returnstrR2;
}

转载于:https://www.cnblogs.com/minzhousblogs/p/9705782.html

KindEditor解决上传视频不能在手机端显示的问题相关推荐

  1. 百度编辑器上传视频以及视频编辑器预览bug解决

    百度编辑器目前来讲是运用比较广泛的一个编辑器了,不仅开源还有中文的文档,所以很受欢迎,不过里面也有许多地方需要开发人员自己调试,其中一个比较常见的问题就是上传视频了,上传视频本身有一些小bug,这个基 ...

  2. 百度编辑器(ueditor)上传视频二次调用丢失链接的解决方法

    之前有接触ueditor,后测试上传视频处有bug???发现视频第一次存到数据库是有链接的但是呢拿出来再编辑的时候发现链接丢了 看到的是这样的 开始想办法改啦,网上搜搜发现挺多人遇到这问题的,经过各种 ...

  3. 微信小程序也许会用到上传视频,针对视频转码转为m3U8格式即web端可以使用的解决办法

    媒体处理这部分的视频转码涉及到 阿里云服务的对象存储OSS服务,消息服务MNS,及媒体处理MTS服务 可以利用阿里云服务的MTS服务即媒体处理  https://mts.console.aliyun. ...

  4. 阿里云视频点播(上传视频)服务最新版本使用方法(解决部分依赖无法下载或不存在问题)

    1.首先复制编写好的工具类(摘取自阿里云官方文档,可以在文芳查看), 然后你需要改写你的ak aksk,其次更改bbucket路径(存储路径),以及点播接入点(如 cn-beijing,cn-shan ...

  5. 百度编辑器Ueditor,上传视频后编辑时src丢失,已解决

    如图, 上传视频后保存,并重新编辑改文章时,video中的src被过滤掉了,折腾了好久,网上都说是在ueditor.config.js的whitList中添加'_src', '_url',经过几番验证 ...

  6. 电脑字体模糊_小红书上传视频模糊?做小红书视频99%的工具都在这了

    到现在小红书视频号功能已经上线快三个月了,越来越多的小伙伴开始拍视频.创作视频笔记,但是对于新接触视频的小伙伴来说,拍摄视频好像是一件很难的事,特别是不清楚该选择什么拍摄设备.不知道怎么剪辑视频,还有 ...

  7. 通过h5页面上传视频到Linux服务器

    1. 上传视频到本地 https://www.jb51.net/article/132531.htm 2. 上传视频到Linux服务器 建立ftp连接(保证服务器已经安装ftp及对应端口,帐号有权限) ...

  8. yii2.0使用ueditior完成上传单张,多张图片,上传视频等操作

    一.前言 由于工作需求需要集成富文本编辑器,本来是想要选用之前用过的WangEditor的,但是考虑到WangEditor还是比较小众,所以最终选择了没用过的Uedtor,这篇文章主要讲述了Yii2. ...

  9. CKEditor上传视频(java)

    CKEditor上传视频 CKEditor批量上传图片 flvplayer.swf播放器 CKEditor整合包(v4.6.1) ----------------------------------- ...

最新文章

  1. bp神经网络代码_机器学习(周志华)课后习题——第五章——神经网络
  2. CSS margin详解
  3. python:将json数据写入到excel
  4. 谈我的“先做人,再做技术人员,最后做程序员”
  5. 编程填空:学生信息处理程序_项目学生:业务层
  6. “蚂蚁漫步”背后的定位原理思考
  7. (计算机组成原理)第四章指令系统-第二节1:指令寻址
  8. gps天线拆解图片_飞宇稳定器拆解:握杆的手,不怕颤抖
  9. Centos 7安装报错:Warning:dracut-initqueue timeout - starting timeout scripts
  10. 深度学习自学(七):腾讯移动端开源框架ncnn学习总结
  11. Oracle数据库学习思维导图
  12. (附源码)计算机毕业设计SSM久宠宠物店管理系统
  13. Centos7下载文件恢复工具 extundelete
  14. 第六场问题 B: Bumped!(Dijkstra + 优先队列优化)
  15. 【Verilog】FPGA驱动Ov7670/Ov7725搭建视频通路(RGB565、灰度图)
  16. 教你用scratch2.0编程两种赛车游戏
  17. 利用random随机生成汉字名字
  18. 响应式网站设计(2)-关于网站制作你不知道的那些文件儿
  19. 【小程序项目分享】闲置车位共享小程序
  20. 鼠标回报率测试软件用哪个,罗摩G5 垃圾渣鼠标...顺便发一个鼠标回报率测试软件...

热门文章

  1. php 注册自动登录,php – 创建第二个自动登录用户的登录页面
  2. mysql改date格式_mysql数据库修改添加Date格式列的方法
  3. linux 安装tcl命令,TCL/TK Linux下安装 | 勤奋的小青蛙
  4. C语言开发笔记(三)自加和自减
  5. C语言代码规范(三)if语句
  6. 字符串连接“+”int、char、string
  7. 160 - 44 defiler.1.exe
  8. bugfix:MySQL内存使用率无限增长以及kill手法
  9. 《dp补卡——子序列问题》
  10. 《MySQL——基于位点orGTID的主备切换协议》