2016-12-03 18 views
0

Vimeoとその自動再生機能を使用しています。問題は、自動再生がモバイルデバイスでは機能しないことと、動画が自動再生されたと想定するタイマーがあることです。動画が再生されたときにイベントが発生することはわかっていますが、自動再生が動作しているかどうかを確認する方法はわかります。自動再生がプログラム的に機能しているかどうかを判断する方法はありますか?私がしたいことは、このようなものです。Vimeoビデオが自動再生するかどうかを検出します。

自動再生はこのデバイスで動作するのですか、または自動再生が実行されましたか? タイマーを忘れずに今すぐすべてのコンテンツを表示してください。

答えて

1

Vimeo Playerの自動再生機能はモバイルデバイスでは機能していません(これはthis articleで通知されています)。また、JavaScript APIもこれらのデバイスで壊れているようです。 Vimeo's Player JavaScript APIを使用して、非モバイルデバイスでビデオを操作したり、モバイルデバイスがJavaScript APIをサポートしているかどうかを推測したりすることができます。自動再生は、それらのデバイス上で開始されているかどうかを確認するには

Vimeoのプレーヤーは準備ができてページ上player.getPaused()と組み合わせてplayイベントを使用することができ作品ました:

は、自動再生は非モバイルデバイスに働いていたかどうかの確認。

<html> 
 
    <head> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
    <script src="https://player.vimeo.com/api/player.js"></script> 
 
    </head> 
 
<body> 
 
    
 
    <iframe id="player" src="https://player.vimeo.com/video/78716964?autoplay=1&title=0&byline=0&portrait=0" width="640" height="360" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe> 
 
    
 
    
 
    <script> 
 
    var player = new Vimeo.Player($('#player')); 
 
    
 
    var state = { autoplaying : false }; 
 
    
 
    player.on('play',() => { 
 
     state.autoplaying = true; 
 
     player.off('play'); 
 
    }); 
 
    
 
    player.getPaused().then((paused) => { 
 
     var playing = !paused; 
 
     state.autoplaying = state.autoplaying || playing; 
 
    }); 
 
    </script> 
 
</body> 
 
</html>

自動再生は、モバイルデバイス上で働いていたかどうかの確認:

今のJavaScript APIが壊れているため、モバイルデバイス上でこれを決定するためのクリーンな方法はありません。任意のAPIメソッドを呼び出してJavaScript APIが有効かどうかを検出し、その結果を待つことができます。結果が短時間で得られなかった場合は、APIが機能していないと言えます。つまり、自動再生が機能しなかったとしましょう。また、あなたは、モバイルデバイスであるかどうかを判断するためにdetecting user agentのようないくつかの技術を使用しているため自動再生が実行されなかったと仮定でき

var player = new Vimeo.Player($('#player')); 
 

 
var state = { 
 
    autoplaying : false, 
 
    apiEnabled : null 
 
}; 
 

 
player.on('play',() => { 
 
    state.autoplaying = true; 
 
    player.off('play'); 
 
}); 
 
        
 
setTimeout(() => { 
 
    if (state.apiEnabled === null) { 
 
    state.apiEnabled = false; 
 
    // Do something 
 
    } 
 
}, 100); 
 
       
 
player.getPaused().then((paused) => { 
 
    state.apiEnabled = true; 
 
    // Do something 
 
});

Vimeoのiframeをハックして自動再生の状態を判断しないことをおすすめします。あなたのスクリプトが将来的に機能するようにするためには、公開APIが必要です。

関連する問題