我的问题很简单..
当我们从发件人应用中选择任何媒体网址时,点击播放视频即可播放的图标。我们所有人都知道chrome-cast支持HTML5 <video> tag
,需要任何URI
来播放视频。因此,当我们从发件人应用中选择任何URL
时,<video>
会将其作为src
属性并将其播放。
<html>
<script src="https://www.gstatic.com/cast/js/receiver/1.0/cast_receiver.js">
</script>
<script type="text/javascript">
cast.receiver.logger.setLevelValue(0);
// Initialize and start the media playing receiver
var receiver = new cast.receiver.Receiver(
'YOUR_APP_ID_HERE',
[cast.receiver.RemoteMedia.NAMESPACE],
"",
5);
var remoteMedia = new cast.receiver.RemoteMedia();
remoteMedia.addChannelFactory(
receiver.createChannelFactory(cast.receiver.RemoteMedia.NAMESPACE));
receiver.start();
window.addEventListener('load', function() {
var elem = document.getElementById('vid');
remoteMedia.setMediaElement(elem);
var checkStatus = function() {
var status = document.getElementById('status');
var st = remoteMedia.getStatus()['state'];
if( st == 0 || remoteMedia.getStatus()['current_time'] == 0 ) {
status.style.display = 'block';
}
else {
if( st == 1 && remoteMedia.getStatus()['current_time'] > 0 ) {
status.innerHTML = 'Paused...';
status.style.display = 'block';
}
else {
status.innerHTML = remoteMedia.getStatus()['current_time'];
status.style.display = 'none';
elem.style.display = 'block';
}
}
}
setInterval(checkStatus, 1000);
});
</script>
<title>Media Player App</title>
<body>
<video id="vid"
style="position:absolute;top:0;left:0;height:100%;width:100%">
<div id="status" style="display:none; font-size:300%; position:absolute;top:40%;left:40%;">
<img src="/images/chrome_loading.gif" width="60%">
</div>
</body>
</html>
所以我的问题在receiver.html
文件中,我们没有向src
提供任何<video>
属性,因此调用哪个Receiver API来执行此操作?< / p>
答案 0 :(得分:1)
接收器中的以下行标识并设置库的“video”元素:
var elem = document.getElementById('vid');
remoteMedia.setMediaElement(elem);
其余部分由您在接收器中包含的javascript库处理(即cast_receiver.js)