ドキュメント
下準備
- ChromeCastがTVで見られるようになっている
- インストールしたChromeCastのアプリケーションを再び開き、端末の「Setting」に進み「Privacy」のところにある「Send this Chromecast's serial number when checking for updates」をOnにしておく
SenderとReceiver
Senderはリクエストオブジェクトを送信することで、Recever側のCast端末で受信し指定のURLを開きます。
Sender
var castApi = cast.Api();
var request = new cast.LaunchRequest(APP_ID, receiver);
castApi.launch(request, onLaunch);
Receiver
var receiver = new cast.receiver.Receiver(APP_ID, ['Test'], "", 5);
receiver.start();
APP-IDの発行
現在GoogleCast SDKはベータ版でホワイトリスト方式を採用しています。
そのためSenderからリクエストするのに必要なAPP-IDの発行をGoogleに要求する必要があります。
上記リンクが切れていたら以下のページから「Request Whitelisting」に遷移。
https://developers.google.com/cast/whitelisting#whitelist-receiver
最低限必要な情報は
- メールアドレス
- ChromeCastのシリアル番号(端末背面に記載)
- Receiver URL(端末にリクエストが送られてきた時に開くURL)
コード
Sender
<html data-cast-api-enabled="true">
<head>
<script>
var cast = cast || {}
var cast_api, cv_activity;
var APP_ID = "YOUR APP ID"
var doLaunch = function(receiver) {
var request = new cast.LaunchRequest(APP_ID, receiver);
cast_api.launch(request, onLaunch);
};
var onLaunch = function(activity) {
console.log(activity);
if (activity.status == "running") {
cv_activity = activity;
} else if (activity.status == "error") {
cv_activity = null;
}
};
var onReceiverList = function(list) {
// If the list is non-empty, show a widget with
// the friendly names of receivers.
// When a receiver is picked, invoke doLaunch with the receiver.
console.log(list);
doLaunch(list[0]);};
function initializeApi(){
cast_api = new cast.Api();
cast_api.addReceiverListener("YouTube", onReceiverList);
}
if (cast && cast.isAvailable) {
// Cast is known to be available
initializeApi();
} else {
// Wait for API to post a message to us
window.addEventListener("message", function(event) {
console.log("message");
console.log(event.data);
if (event.source == window && event.data &&
event.data.source == "CastApi" &&
event.data.event == "Hello")
initializeApi();
});
};
</script>
</head>
<body>
</body>
</html>
Receiver
<html>
<title>Hello Chromecast</title>
<link href='http://fonts.googleapis.com/css?family=Droid+Sans' rel='stylesheet' type='text/css'>
<style>body { font-family: 'Droid Sans', Helvetica; font-size: 3em; text-align: center; color: white; margin: 5%;}</style>
<script src="https://www.gstatic.com/cast/js/receiver/1.0/cast_receiver.js"></script>
<script type="text/javascript">
var castAppId = 'YOUR APP ID';
var receiver = new cast.receiver.Receiver(castAppId, ['Test'], "", 5);
receiver.start();
</script>
<body>
<h1>Google Cast Receiver</h1>
<h2>Hello Chromecast</h2>
</body>
</html>