Ziggeo SDK Video Player - 获取寻道时间
Ziggeo SDK Video Player - get seek time
在 Ziggeo 的任何 SDK 中,
你能找出播放器在视频的第几秒吗?
我想知道观众何时进入视频 30 秒(例如)。
好像有播放、暂停、寻找等方法(事件);但它们中的任何一个是否可以 return 用户在视频中所处位置的值并不明显。
我可以通过观看播放和暂停事件来推断它们的位置,但是搜索会转到视频的不可预测的部分
如您所说,有几个事件可用于此类实施,我假设您将使用 v2(因为这是推荐的使用方式)。
事件是:
- 正在播放
- 暂停
- 结束
- 寻求
playing
事件会在3种情况下被激活:
- 视频播放开始
- 视频暂停后播放动作被激活
- 搜索选项用于到达视频中的特定点,
seek
触发事件然后播放也会触发(因为视频现在正在再次播放)。
paused
事件将在2种情况下被激活:
- 当有人点击暂停按钮时
- 在最后,暂停事件触发,然后是
ended
事件。
ended
和 seek
事件仅在特定情况出现时触发(分别使用视频结束或搜索)。
然而,seek
事件有一个传递到函数中的参数 - position
允许我们快速获得查找操作发生的确切时间。
- 了解这一点,我们就知道会发生什么以及何时发生。
获取数据(任何视频数据)的方法是使用embedding.get();
。按原样使用它,将 return 一个完整的有用细节对象,但是对于位置,您只需键入 'position'.
这是有效的事件代码:
player.on('playing', function(){
console.log('This is "playing" event from ' + player.get('position') + ' of ' + player.get('totalduration') );
});
player.on('paused', function(){
console.log('This is "paused" event at ' + player.get('position') + ' of ' + player.get('totalduration') );
});
player.on('ended', function(){
console.log('This is "ended" event at ' + player.get('position') + ' of ' + player.get('totalduration') );
});
player.on('seek', function(position){
console.log('This is "seek" event at ' + player.get('position') + ' of ' + player.get('totalduration') );
console.log('quicker way and more reliable:' + position);
});
- 你可以看到那里抓住了 'position' 和 'totalduration',这只是为了举例。
- 值得一提的是,seek 事件在 position 参数中获取了正确的数据,因此请使用它而不是 .get() 方法,因为它可以告诉您一个略 "older" 的值。
以下是完整的代码片段,但是您需要添加自己的应用程序令牌和视频令牌。
为此,只需将 "APP_TOKEN" 替换为您的应用程序令牌并将 "VIDEO_TOKEN" 替换为视频令牌或密钥。
<!DOCTYPE html>
<html>
<head>
<!-- We are declaring our resource calls at this location -->
<link rel="stylesheet" href="https://assets-cdn.ziggeo.com/v2-stable/ziggeo.css" />
<script src="https://assets-cdn.ziggeo.com/v2-stable/ziggeo.js"></script>
<script>
var ziggeoapp = new ZiggeoApi.V2.Application({
token:"APP_TOKEN",
webrtc_streaming: true
});
ZiggeoApi.V2.Locale.setLocale("en");
// the above can be quickly retrieved from https://ziggeo.com/docs/sdks/javascript/browser-integration/header
//utilizing application event. This makes sure that the code is checked for after DOMReady and Ziggeo system is initialized.
//application events: https://ziggeo.com/docs/sdks/javascript/browser-interaction/application-events
ziggeoapp.on('ready', function() {
var player = new ZiggeoApi.V2.Player({
element: document.getElementById('player_placeholder'),
attrs: {
countdown: 3,
width: 640,
height: 480,
theme: 'modern',
themecolor: 'red',
video: 'VIDEO_TOKEN'
}
});
player.activate();
//if we want to listed to all embeddings on the page, regardless of knowing which it is, we could use the application wide embedding events approach (global events system): https://ziggeo.com/docs/sdks/javascript/browser-interaction/application-embedding-events
//however the private events seem much better for reacting to them
//https://ziggeo.com/docs/sdks/javascript/browser-interaction/events
player.on('playing', function(){
console.log('This is "playing" event from ' + player.get('position') + ' of ' + player.get('totalduration') );
});
player.on('paused', function(){
console.log('This is "paused" event at ' + player.get('position') + ' of ' + player.get('totalduration') );
});
player.on('ended', function(){
console.log('This is "ended" event at ' + player.get('position') + ' of ' + player.get('totalduration') );
});
player.on('seek', function(position){
console.log('This is "seek" event at ' + player.get('position') + ' of ' + player.get('totalduration') );
console.log('quicker way and more reliable:' + position);
});
});
</script>
</head>
<body>
<div id="player_placeholder"></div>
</body>
</html>
我在代码中添加了带有链接的注释,希望它能提供更多信息。
在 Ziggeo 的任何 SDK 中,
你能找出播放器在视频的第几秒吗?
我想知道观众何时进入视频 30 秒(例如)。
好像有播放、暂停、寻找等方法(事件);但它们中的任何一个是否可以 return 用户在视频中所处位置的值并不明显。
我可以通过观看播放和暂停事件来推断它们的位置,但是搜索会转到视频的不可预测的部分
如您所说,有几个事件可用于此类实施,我假设您将使用 v2(因为这是推荐的使用方式)。
事件是:
- 正在播放
- 暂停
- 结束
- 寻求
playing
事件会在3种情况下被激活:
- 视频播放开始
- 视频暂停后播放动作被激活
- 搜索选项用于到达视频中的特定点,
seek
触发事件然后播放也会触发(因为视频现在正在再次播放)。
paused
事件将在2种情况下被激活:
- 当有人点击暂停按钮时
- 在最后,暂停事件触发,然后是
ended
事件。
ended
和 seek
事件仅在特定情况出现时触发(分别使用视频结束或搜索)。
seek
事件有一个传递到函数中的参数 - position
允许我们快速获得查找操作发生的确切时间。
- 了解这一点,我们就知道会发生什么以及何时发生。
获取数据(任何视频数据)的方法是使用embedding.get();
。按原样使用它,将 return 一个完整的有用细节对象,但是对于位置,您只需键入 'position'.
这是有效的事件代码:
player.on('playing', function(){
console.log('This is "playing" event from ' + player.get('position') + ' of ' + player.get('totalduration') );
});
player.on('paused', function(){
console.log('This is "paused" event at ' + player.get('position') + ' of ' + player.get('totalduration') );
});
player.on('ended', function(){
console.log('This is "ended" event at ' + player.get('position') + ' of ' + player.get('totalduration') );
});
player.on('seek', function(position){
console.log('This is "seek" event at ' + player.get('position') + ' of ' + player.get('totalduration') );
console.log('quicker way and more reliable:' + position);
});
- 你可以看到那里抓住了 'position' 和 'totalduration',这只是为了举例。
- 值得一提的是,seek 事件在 position 参数中获取了正确的数据,因此请使用它而不是 .get() 方法,因为它可以告诉您一个略 "older" 的值。
以下是完整的代码片段,但是您需要添加自己的应用程序令牌和视频令牌。 为此,只需将 "APP_TOKEN" 替换为您的应用程序令牌并将 "VIDEO_TOKEN" 替换为视频令牌或密钥。
<!DOCTYPE html>
<html>
<head>
<!-- We are declaring our resource calls at this location -->
<link rel="stylesheet" href="https://assets-cdn.ziggeo.com/v2-stable/ziggeo.css" />
<script src="https://assets-cdn.ziggeo.com/v2-stable/ziggeo.js"></script>
<script>
var ziggeoapp = new ZiggeoApi.V2.Application({
token:"APP_TOKEN",
webrtc_streaming: true
});
ZiggeoApi.V2.Locale.setLocale("en");
// the above can be quickly retrieved from https://ziggeo.com/docs/sdks/javascript/browser-integration/header
//utilizing application event. This makes sure that the code is checked for after DOMReady and Ziggeo system is initialized.
//application events: https://ziggeo.com/docs/sdks/javascript/browser-interaction/application-events
ziggeoapp.on('ready', function() {
var player = new ZiggeoApi.V2.Player({
element: document.getElementById('player_placeholder'),
attrs: {
countdown: 3,
width: 640,
height: 480,
theme: 'modern',
themecolor: 'red',
video: 'VIDEO_TOKEN'
}
});
player.activate();
//if we want to listed to all embeddings on the page, regardless of knowing which it is, we could use the application wide embedding events approach (global events system): https://ziggeo.com/docs/sdks/javascript/browser-interaction/application-embedding-events
//however the private events seem much better for reacting to them
//https://ziggeo.com/docs/sdks/javascript/browser-interaction/events
player.on('playing', function(){
console.log('This is "playing" event from ' + player.get('position') + ' of ' + player.get('totalduration') );
});
player.on('paused', function(){
console.log('This is "paused" event at ' + player.get('position') + ' of ' + player.get('totalduration') );
});
player.on('ended', function(){
console.log('This is "ended" event at ' + player.get('position') + ' of ' + player.get('totalduration') );
});
player.on('seek', function(position){
console.log('This is "seek" event at ' + player.get('position') + ' of ' + player.get('totalduration') );
console.log('quicker way and more reliable:' + position);
});
});
</script>
</head>
<body>
<div id="player_placeholder"></div>
</body>
</html>
我在代码中添加了带有链接的注释,希望它能提供更多信息。