frame-player是一款基于JSON數(shù)據(jù)HTML5視頻播放器js插件。該插件沒有使用視頻文件，只使用JSON格式的數(shù)據(jù)。在移動(dòng)手機(jī)設(shè)備上使用圖片幀的形式來播放視頻文件。

HTML5視頻文件的一個(gè)最大問題是不能再手機(jī)設(shè)備上在線播放。通常手機(jī)設(shè)備的解決方案是通過原生的播放器來打開HTML5視頻文件，而不是讓頁面來打開它們，以確保視頻文件可以正常播放。該插件通過將播放文件替換為特定的JSON文件，然后以圖片序列的形式在手機(jī)設(shè)備上展示視頻文件。

安裝

bower install frame-player

在頁面中引入frameplayer.css和frameplayer.js文件。

使用方法

HTML結(jié)構(gòu)

在頁面中插入下面的HTML代碼，data-src屬性是視頻文件的JSON格式文件。

初始化插件

var player = new FramePlayer('my-player', options);

player.play();

配置參數(shù)

下面是這個(gè)視頻播放插件的一些可用參數(shù)：

var options = ({

'rate': 30,

'controls': false,

'autoplay': true,

'width': '640px',

'height': '390px',

// 'radius': '50%'

});

方法

方法

參數(shù)

返回值

描述

play()

None

Nothing

開始播放視頻文件

pause()

None

Nothing

暫停播放視頻文件

resume()

None

Nothing

暫停之后繼續(xù)播放視頻文件

生成視頻的JSON格式文件

1、首先使用ffmpeg來從一個(gè)視頻文件中生成圖片幀。

ffmpeg -i video.mp4 -an -f image2 "%d.jpg"

2、然后將所有的圖片幀轉(zhuǎn)換為一個(gè)單獨(dú)的JSON文件。

可使用 Node.js：

cd converter/nodejs

node app.js frameStart frameEnd folder/to/imgs/ json/video.json

也可以使用 PHP：

cd converter/php

php to_data_uri.php frameStart frameEnd folder/to/imgs/ json/video.json

總結(jié)

以上是生活随笔為你收集整理的php h5视频播放器,基于JSON数据HTML5视频播放器js插件的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。