vimeo 和 javascript (froogaloop) - 获取视频信息
我有这个非常简单的代码。我对此有一些问题。
<!DOCTYPE html>
<html>
<head>
<!--
<script src="http://a.vimeocdn.com/js/froogaloop2.min.js"></script>
-->
<script src="https://raw.github.com/vimeo/player-api/master/javascript/froogaloop.js"></script>
</head>
<body>
<iframe
id="vimeo_1"
src="http://player.vimeo.com/video/7100569?api=1&player_id=test"
width="400"
height="225"
frameborder="0">
</iframe>
<a id="play" href="javascript:void(0)">play</a>
<a id="pause" href="javascript:void(0)">pause</a>
<a id="mute" href="javascript:void(0)">mute</a>
<input id="volume" type="range" min="0" max="1" value="0.5" step="0.01" />
<a id="videoInfo" href="javascript:void(0)">video info</a>
<div>
<ul id="showVideoInfo">
</ul>
</div>
<div id="debug"></div>
<script>
var v1 = document.getElementById('vimeo_1');
var play = document.getElementById('play');
var pause = document.getElementById('pause');
var mute = document.getElementById('mute');
var volume = document.getElementById('volume');
var videoInfo = document.getElementById('videoInfo');
var debug = document.getElementById('debug');
$f(v1).addEvent('ready', function(pID){
console.log('ready');
});
addEvent(play, 'click', playVideo);
addEvent(pause, 'click', pauseVideo);
addEvent(mute, 'click', muteVideo);
addEvent(volume, 'change', volumeVideo);
addEvent(videoInfo, 'click', infoVideo);
function addEvent(obj, name, callback) {
if (obj.addEventListener)
obj.addEventListener(name, callback, false);
else
obj.attachEvent(name, callback, false);
}
function playVideo() {
console.log('play');
$f(v1).api('play');
}
function pauseVideo() {
console.log('pause');
$f(v1).api('pause');
}
function muteVideo() {
console.log('mute');
$f(v1).api('setVolume', 0);
}
function volumeVideo() {
console.log(this.value);
$f(v1).api('setVolume', this.value);
}
function infoVideo() {
console.log('videoInfo: ');
$f(v1).api('paused', function(v) {
console.log(v);
});
}
</script>
</body>
</html>
首先,像播放、暂停、静音和音量滑块(仅限 webkit)这样的按钮工作正常。 但是,当我需要从视频中获取一些视频数据并在某个地方(例如控制台)打印时,没有任何效果,并且显示类似的消息:
在这里搜索时我发现了一些有关此问题的问题,但对他们有用的一切对我来说根本不起作用。啊!
谁能帮助我吗?谢谢。
I have this really simple code. And i've some problems with it.
<!DOCTYPE html>
<html>
<head>
<!--
<script src="http://a.vimeocdn.com/js/froogaloop2.min.js"></script>
-->
<script src="https://raw.github.com/vimeo/player-api/master/javascript/froogaloop.js"></script>
</head>
<body>
<iframe
id="vimeo_1"
src="http://player.vimeo.com/video/7100569?api=1&player_id=test"
width="400"
height="225"
frameborder="0">
</iframe>
<a id="play" href="javascript:void(0)">play</a>
<a id="pause" href="javascript:void(0)">pause</a>
<a id="mute" href="javascript:void(0)">mute</a>
<input id="volume" type="range" min="0" max="1" value="0.5" step="0.01" />
<a id="videoInfo" href="javascript:void(0)">video info</a>
<div>
<ul id="showVideoInfo">
</ul>
</div>
<div id="debug"></div>
<script>
var v1 = document.getElementById('vimeo_1');
var play = document.getElementById('play');
var pause = document.getElementById('pause');
var mute = document.getElementById('mute');
var volume = document.getElementById('volume');
var videoInfo = document.getElementById('videoInfo');
var debug = document.getElementById('debug');
$f(v1).addEvent('ready', function(pID){
console.log('ready');
});
addEvent(play, 'click', playVideo);
addEvent(pause, 'click', pauseVideo);
addEvent(mute, 'click', muteVideo);
addEvent(volume, 'change', volumeVideo);
addEvent(videoInfo, 'click', infoVideo);
function addEvent(obj, name, callback) {
if (obj.addEventListener)
obj.addEventListener(name, callback, false);
else
obj.attachEvent(name, callback, false);
}
function playVideo() {
console.log('play');
$f(v1).api('play');
}
function pauseVideo() {
console.log('pause');
$f(v1).api('pause');
}
function muteVideo() {
console.log('mute');
$f(v1).api('setVolume', 0);
}
function volumeVideo() {
console.log(this.value);
$f(v1).api('setVolume', this.value);
}
function infoVideo() {
console.log('videoInfo: ');
$f(v1).api('paused', function(v) {
console.log(v);
});
}
</script>
</body>
</html>
First of all, buttons like PLAY, PAUSE, MUTE and the volume slider (webkit only) works fine.
But when i need to get some video data from video and print somewhere (console, for example) nothing works and a message like that is shown:
Searching around here i've found some question about that, but everithing that works for them simply not work for me. argh!
Can anyone help me? Thanks.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
您出现此错误是因为您正在将视频作为本地文件播放。您必须在 Web 服务器上运行代码(甚至在本地使用 MAMP 或 WAMP)。
肯.
You have this error because you are playing your video as a local file. You have to run your code on a web server (even locally with MAMP or WAMP).
Ken.