接收器应用程序如何从chrome-cast中的发件人应用程序接收URL

时间:2013-12-24 06:51:20

标签: google-cast chromecast

我的问题很简单..

当我们从发件人应用中选择任何媒体网址时,点击播放视频即可播放的图标。我们所有人都知道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>

1 个答案:

答案 0 :(得分:1)

接收器中的以下行标识并设置库的“video”元素:

var elem = document.getElementById('vid');
remoteMedia.setMediaElement(elem);

其余部分由您在接收器中包含的javascript库处理(即cast_receiver.js)