手機版 | 登陸 | 注冊 | 留言 | 設首頁 | 加收藏
當前位置: 網站首頁 > 建站教程 > 織夢教程 > 文章 當前位置: 織夢教程 > 文章

織夢百度小程序微信小程序video標簽不支持視頻封面,autoplay等問題修復方法

時間:2020-03-10    點擊: 次    來源:網絡    作者:佚名 - 小 + 大

<template name="bdParseVideo">   <!--增加video標簽支持,并循環添加-->   <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>

改成:

<template name="bdParseVideo">   <!--增加video標簽支持,并循環添加-->   <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)針對dedecms用戶以及其它video的poster屬性不顯示全網址的修復辦法

在小程序的內容之前使用正則替換,補全poster地址:

国产视频app dede版百度小程序demo修復:show.js的113行加入以下代碼:

content.body = content.body.replace(/poster=\"(.*)\"/gi, 'poster=\"'+ app.globalData.host+'$1\"');


二、微信小程序wxParse修復方法

国产视频app (1)打開wxParse/wxParse.wxml找到video標簽解析處大致第13行:

<template name="wxParseVideo">   <!--增加video標簽支持,并循環添加-->   <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>

改成:

<template name="wxParseVideo">   <!--增加video標簽支持,并循環添加-->   <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)同理需要對文章中的poster不是全網址的視頻封面圖片補全網址

dede版微信小程序demo修復:show.js的105行加入以下代碼:

content.body = content.body.replace(/poster=\"(.*)\"/gi, 'poster=\"' + app.globalData.host + '$1\"');


【注意】

国产视频app 小程序的video和H5的video稍微有點不同

autoplay、controls、loop、muted等屬性需要寫成:autoplay=“{{true}}”,controls=“{{true}}”

這樣就可以實現了h5的video標簽的常用屬性,如圖:

織夢百度小程序微信小程序video標簽不支持視頻封面,autoplay等問題修復方法

在現有的百度小程序富文本組件bdParse,以及微信小程序富文本組件wxParse,對于video的標簽解析僅僅只是有個video而已,其他的屬性幾乎都過濾掉了,所以就需要我們假設對于屬性(由于H5的video屬性和小程序的video屬性要求不一樣,以小程序為主)

一、百度小程序的bdParse修復方法

国产视频app (1)打開bdParse/bdParse.swan找到video標簽解析處大致第10行:

上一篇:織夢后臺添加了一篇文章,但是前臺顯示兩篇一模一樣的文章

下一篇:禁止織夢會員發布文章內容中帶超鏈接修改教程

 |   QQ:292823885  |  地址:北京市東城區  |  郵箱:servcra@vip.qq.com  |