当前位置:网站首页>Fix the problem that the rich text component of the applet does not support the properties of video cover, autoplay, controls, etc
Fix the problem that the rich text component of the applet does not support the properties of video cover, autoplay, controls, etc
2022-06-26 09:04:00 【CMS applet plug-in [official]】
In the existing Baidu applet rich text component bdParse, And the rich text component of wechat applet wxParse, about video The tag parsing of is just a video nothing more , Almost all other attributes are filtered out , So we need to assume that for attributes ( because H5 Of video Properties and applet video Different attribute requirements , It's mainly small programs )
One 、 Baidu applet bdParse Repair method
(1) open bdParse/bdParse.swan find video The label parsing section is roughly the 10 That's ok :
- <template name="bdParseVideo">
- <!-- increase video Tag support , And add... In cycles -->
- <view class="{ {item.classStr}} bdParse-{ {item.tag}}" style="{ {item.styleStr}}">
- <video class="{ {item.classStr}} bdParse-{ {item.tag}}-video" src="{ {item.attr.src}}"></video>
- </view>
- </template>
Change to :
- <template name="bdParseVideo">
- <!-- increase video Tag support , And add... In cycles -->
- <view class="{ {item.classStr}} bdParse-{ {item.tag}}" style="{ {item.styleStr}}">
- <video class="{ {item.classStr}} bdParse-{ {item.tag}}-video" poster="{ {item.attr.poster}}" autoplay="{ {item.attr.autoplay}}" controls="{ {item.attr.controls}}" loop="{ {item.attr.loop}}" muted="{ {item.attr.muted}}" src="{ {item.attr.src}}"></video>
- </view>
- </template>
(2) in the light of dedecms Users and others video Of poster Property does not display the full URL fix
Use regular substitution before the contents of the applet , completion poster Address :
dede Version Baidu applet demo Repair :show.js Of 113 Add the following code to the line :
- content.body = content.body.replace(/poster=\"(.*)\"/gi, 'poster=\"'+ app.globalData.host+'$1\"');
Two 、 Wechat applet wxParse Repair method
(1) open wxParse/wxParse.wxml find video The label parsing section is roughly the 13 That's ok :
- <template name="wxParseVideo">
- <!-- increase video Tag support , And add... In cycles -->
- <view class="{ {item.classStr}} wxParse-{ {item.tag}}" style="{ {item.styleStr}}">
- <video class="{ {item.classStr}} wxParse-{ {item.tag}}-video" src="{ {item.attr.src}}"></video>
- </view>
- </template>
Change to :
- <template name="wxParseVideo">
- <!-- increase video Tag support , And add... In cycles -->
- <view class="{ {item.classStr}} wxParse-{ {item.tag}}" style="{ {item.styleStr}}">
- <video class="{ {item.classStr}} wxParse-{ {item.tag}}-video" poster="{ {item.attr.poster}}" autoplay="{ {item.attr.autoplay}}" controls="{ {item.attr.controls}}" loop="{ {item.attr.loop}}" muted="{ {item.attr.muted}}" src="{ {item.attr.src}}"></video>
- </view>
- </template>
(2) In the same way, it is necessary to correct the poster The video cover image that is not the full web address complements the web address
dede Version of wechat applet demo Repair :show.js Of 105 Add the following code to the line :
- content.body = content.body.replace(/poster=\"(.*)\"/gi, 'poster=\"' + app.globalData.host + '$1\"');
【 Be careful 】
Applet video and H5 Of video It's a little different
autoplay、controls、loop、muted And other attributes need to be written as :autoplay=“{ {true}}”,controls=“{ {true}}”
That's how it works h5 Of video Common properties of tags , Pictured :

边栏推荐
- Live review | smardaten lihongfei interprets the Research Report on China's low / no code industry: the wind direction has changed
- Matlab drawing checkerboard (camera calibration)
- 攔截器與過濾器的實現代碼
- ThreadLocal
- 深度学习论文阅读目标检测篇(七)中文版:YOLOv4《Optimal Speed and Accuracy of Object Detection》
- 自动化测试中,三种常用的等待方式,强制式(sleep) 、 隐式 ( implicitly_wait ) 、显式(expected_conditions)
- [qnx hypervisor 2.2 user manual]12.2 terminology (II)
- Data warehouse (3) star model and dimension modeling of data warehouse modeling
- Yolov5 advanced level 2 installation of labelimg
- The solution of positioning failure caused by framework jump
猜你喜欢

Matlab drawing checkerboard (camera calibration)

Structure diagram of target detection network

Construction and verification of mongodb sharding environment (redis final assignment)

Particles and sound effect system in games104 music 12 game engine

In depth study paper reading target detection (VII) Chinese version: yolov4 optimal speed and accuracy of object detection

隐藏式列表菜单以及窗口转换在Selenium 中的应用
![[cloud primordial | kubernetes chapter] go deep into the foundation of all things - container (V)](/img/67/26508edc451139cd0f4c9511ca1ed2.png)
[cloud primordial | kubernetes chapter] go deep into the foundation of all things - container (V)

Drawing with MATLAB (1)

PD快充磁吸移动电源方案

phpcms v9后台文章列表增加一键推送到百度功能
随机推荐
Optimize quiver function in MATLAB to draw arrow diagram or vector diagram (1) -matlab development
PD快充磁吸移動電源方案
Yolov5进阶之一摄像头实时采集识别
Checkerboard generation + camera calibration + stereo matching
Drawing with MATLAB (2) -- color ring
Phpcms V9 mobile phone access computer station one-to-one jump to the corresponding mobile phone station page plug-in
读书笔记:SQL 查询中的SQL*Plus 替换变量(DEFINE变量)和参数
20220213 Cointegration
在哪个软件上开户比较安全
【MATLAB GUI】 键盘回调中按键识别符查找表
isinstance()函数用法
1.26 pytorch learning
编程训练7-日期转换问题
Practice is the fastest way to become a network engineer
9. code generation
Yolov5进阶之五GPU环境搭建
Ultrasonic image segmentation
1.23 neural network
1.21 study gradient descent and normal equation
2021 software university ranking crawler program