如何创建CAF Receiver?

时间:2017-11-07 09:45:01

标签: javascript chromecast google-cast

最近,谷歌将其接收器升级到版本V3。

Google演示页面中有一个简单的演示,如下所示:

<html>
<head>
</head>
<body>
  <cast-media-player id="player"></cast-media-player>
  <style>
    #player {
        --theme-hue: 210;
        --splash-image: url("my.png");
    }
  </style>
  <script type="text/javascript" src="//www.gstatic.com/cast/sdk/libs/caf_receiver/v3/cast_receiver_framework.js">
  </script>
  <script>
    const context = cast.framework.CastReceiverContext.getInstance();
    const playerManager = context.getPlayerManager();

    // intercept the LOAD request to be able to read in a contentId and get data
    playerManager.setMessageInterceptor(
        cast.framework.messages.MessageType.LOAD, loadRequestData => {
            if (loadRequestData.media && loadRequestData.media.contentId) {
                return thirdparty.getMediaById(loadRequestData.media.contentId)
                .then(media => {
                  if (media) {
                    loadRequestData.media.contentUrl = media.url;
                    loadRequestData.media.contentType = media.contentType;
                    loadRequestData.media.metadata = media.metadata;
                  }
                  return loadRequestData;
                });
            }
            return loadRequestData;
        });

    // listen to all Core Events
    playerManager.addEventListener(cast.framework.events.category.CORE,
        event => {
            console.log(event);
        });

    const MyCastQueue = class extends cast.framework.QueueBase {
        initialize(loadRequestData) {
            const media = loadRequestData.media;
            const items = [];
            items.push(myCreateItem(media)); // your custom function logic

            const queueData = new cast.framework.messages.QueueData();
            queueData.items = items;

            return queueData;
        }

        nextItems(itemId) {
           return [myCreateNextItem()]; // your custom function logic
        }
    };

    const playbackConfig = new cast.framework.PlaybackConfig();

    // Sets the player to start playback as soon as there are five seconds of
    // media contents buffered. Default is 10.
    playbackConfig.autoResumeDuration = 5;

    const myCastQueue = new MyCastQueue(); // create instance of queue Object

    context.start({queue: myCastQueue, playbackConfig: playbackConfig});
  </script>
</body>
</html>

自: https://developers.google.com/cast/docs/caf_receiver_features#styling-the-player

但是当我调试它时,出现'thirdparty' is undefined

错误

有没有人可以告诉我如何创建CAF接收器?

1 个答案:

答案 0 :(得分:2)

这是示例代码。你应该自己提供这些额外的功能。

该示例显示如何覆盖排队系统以执行基于接收器的排队。它不是一个很好的例子,因为它没有提供异步获取基于服务器的队列的例子。

如果您不需要接收器管理队列,您可以从上一页显示的最小CAF接收器开始。这足以使远程调试器工作,这至少是有一个自定义接收器的一个很好的理由。

https://developers.google.com/cast/docs/caf_receiver_basic

我做了一个更完整的例子。 https://gist.github.com/jcable/45c65a72074763a9ec30ddb1ff217517