googlecast / castvideos-chrome Goto Github PK

I used this sample sender and Default Media Receiver to play an HLS stream. It's showing only the blue Chromecast icon instead of playing the video on TV. The stream is encrypted with aes-128 without an IV. I have noticed if I remove the encryption it works fine.
The encrypted file works fine on web players such as video.js.
My m3u8 is using #EXT-X-VERSION:1
Is Googlecast compatible with AES-128 encryption without an IV? Since video.js and other web player can play the encrypted stream, I assume there is no issue with the encrypted stream itself. The receiver and key delivery URL are both hosted on HTTPS.
This is what the server manifest looks like for each stream variant:

#EXTM3U
#EXT-X-VERSION:1
#EXT-X-MEDIA-SEQUENCE:1
#EXT-X-ALLOW-CACHE:NO
#EXT-X-TARGETDURATION:8
#EXT-X-KEY:METHOD=AES-128,URI="https://www.keyserver.com/HLSkey.ashx"
#EXTINF:8, no desc
VideoFile-audio%3D96000-video%3D1395000-1.ts
#EXTINF:8, no desc
VideoFile-audio%3D96000-video%3D1395000-2.ts

Currently, when playing a video with this plugin (for example, in demo), you can only cast from within the player.
Pressing the overflow menu in chrome, clicking cast, and selecting where to cast - doesn't cast anything.
It should be possible to cast the video from chromes native casting button.
See YouTube's behavior, for example.

Is pushing an audio clip (a mp3) look any different in this framework? It would be nice to have a couple of examples that demonstrate this.

It's probably not that different, but it would be helpful to have an example.

Thank you for posting this!

I'm trying to test streaming a local video file to my chromecast. With the default settings, castvideos-chrome works fine (aside from the red SAMPLE in the middle). However, when I switch to DEFAULT_MEDIA_RECEIVER_APP_ID, my video won't load. I don't receive any errors either, so I'm left with no indication of why this is.

Why would the default receiver not work? Is there a way to use the same C0868879 receiver just without the red SAMPLE on it?

Does the google-cast button handle multiple players on the same page?

If yes how can I pass to it the element to cast?

hiii,
i just downlaoded the code present in github and it is based on javascript.i executed the code it is working fine.and i just want to develop in reactjs.so i copied the same js files and pasted in reactapp.
and i am getting the error of "cast" and "chrome" undefined.

so in order to resolve this do i need to install or import any package.
please help me out this.
thankyou.

Is it possible to integrate this Cast Chrome Sender SDK into a Cordova App? Or does it only work in a Chrome Browser?

I am able to reproduce this issue with the sample Chrome sender app (v3) here on GitHub and our own implementation. Tested with Chrome Version 54.0.2840.99 m on Windows 10 and an up-to-date Chromecast device.
To reproduce:

• install app from GitHub on local server and open index.html in Chrome (this also happens on a real site like http://www.staging-rmp.com/cast/)
• play first item (BBB) on sender device. Cast.
• wait or seek for content to end.
• Cast device enters IDLE mode once content has finished
• Request a new play after content has ended and cast device is in IDLE mode
• LOADING of same media happens and player then go to PLAYING and then IDLE mode again. A this point sender device cannot control remote player anymore.
• Requesting a new play cause a new LOADING of media process which ends in correct and expected behaviour (e.g. sender can control remote).

Can you please provide guidelines on how to properly handle end of content when the same media is reloaded?
Thanks
Arnaud

I'm serving from localhost on Chromebook (using browsersync to serve). I get this error in Chrome

Uncaught ReferenceError: cast is not defined
    at CastPlayer.initializeCastPlayer (CastVideos.js:180)
    at window.__onGCastApiAvailable (CastVideos.js:1645)
    at chrome.cast.fa (cast_sender.js:97)

I put a debugger before castPlayer.initializeCastPlayer(); in the handler for __onGCastApiAvailable. This shows that - most of the time - the cast object is not defined even though the callback is called with isAvailable as true. See screenshot - (the watch area shows the undefined cast object). If I refresh repeatedly, cast is occasionally defined.

Hello,

there is a bug when we want to play (or replay) a video after the last one ended. The new video starts on the chromecast, but the local player interface isn't synchronise anymore. The play button doesn't work, seeking is impossible. Only the sound can be controlled.
To reproduce :

• start a video.
• wait until the end of the video.
• start a new video or replay the current video.

TEST on :

• chrome Version 55.0.2883.95 (64-bit) Mac OS X

I have spent a few days trying to make sense of the sparse documentation for the Cast SDK for Chrome, and I'm still not making progress. Streaming a simple MP4 to a ChromeCast is an exercise in frustration, in large part due to the terrible documentation.

First, an official demo should be visible somewhere without pulling the repository. It should explain what it does, how it does it, and what each bit of code does. This repository is little more than a code dump, and developers expect more from the docs of such an important product.

Someone created a far simpler example to get people started, seemingly after dealing with the same frustrations. https://gist.github.com/guerrerocarlos/3aca64069853d8d24a83b481246f23ca

I'm trying to use the CastVideos.js file here and adapt it to also display tracks; however, I haven't been able to achieve it. I don't want to activate them when loading, so how do I use the editTracksInfo in that current example? Or what element holds that method: remotePlayer or remotePlayerController, and where?

Any hints will be appreciated. Thanks in advance.

I'm able to cast a video to my chromecast, but if I refresh the page, the connection to chromecast is lost, that is, the video keeps playing on the TV but CastVideos-chrome page shows the local player and to connect again to chromecast I have to click on the cast button, disconnect and then re-connect

iOS 10.1.1
Chrome 54.0.2840.91
I tried the sample app provided here on GitHub which makes use of the <button is="google-cast-button"></button> on Chrome for iOS and the cast icon does not show.
This issue can also be reproduced in our application.
Tried on 2 different iOS 10 devices (iPhone + iPad) with same results.
The cast icon does show on Chrome 54 for Android 6/7.
Thanks
Arnaud

Do we have a way to detect how many chrome cast devices are available on the network?

For example, we have 3 devices attached to 3 different TVs
We want a way to first detect all the Cast devices using a simple JS code; so it should list all 3 available cast devices' names or other info capabilities.

It would be great if we have this.

I haven't found a method to list receivers on the network, but I am still learning my way around the SDK. Is there a method for that, or is that restricted to the browser UI for selecting a receiver?

want to add user-agent manager extension on chromecast device, plus there should be a way to add mouse/keyboard events using remove extension on desktop/android/ios so that we can use chromecast as a normal browser. dont want to go in wrong direction using https://forum.xda-developers.com/showthread.php?t=2382364 .

please tell me is it feasible without chromecast device hardware changes. or you don't want such features in chromecast

How to initialize Chromecast in VueJs?
if you do as in the code below, an error appears:

index.html

<!DOCTYPE html>
<html>
<head>
<title>Cast Videos: Google Cast Chrome Sender SDK Demo App</title>
<link rel="stylesheet" type="text/css" href="css/CastVideos.css">
<link href='//fonts.googleapis.com/css?family=Roboto&subset=latin,cyrillic-ext,greek-ext,latin-ext' rel='stylesheet' type='text/css'>
</head>
<body>
<div id="app">
.....
<button @click="startCast()">
Cast
</button>
.....
</div>
      <script type="text/javascript" src="https://www.gstatic.com/cv/js/sender/v1/cast_sender.js?loadCastFramework=1"></script>
</body>
</html>

palyer.vue

<template>
...
</template>
<script>
	import CastVideo from '../CastVideo.js'
	export default {
		name: 'palyer',
		data() {},
		methods(){
		startCast(){
			var a = new CastVideo();
			a.initializeCastPlayer();
		}
	}
</script>

Please tell me what I'm doing wrong.

Referenced here,
https://support.google.com/chromecast/thread/21980521?hl=en

Hello,
I have a home LAN web server on a Raspberry Pi, which has lots of home movies as .mp4(h.264/aac).
It serves both http and https-with-a-self-signed-certificate.

The Pi has no access path in from the internet and I do NOT wish to create port forwarding or firewall holes.

I would like to cast my home movies in the home LAN to chromecasts devices in my home LAN.

Using example web server code from https://github.com/googlecast/CastVideos-chrome

1. using plain http: to the Pi4 works but the cast icon is does not appear on the main page in the browser
2. using a TLS self-signed certificate on the Pi, then https: to the main page on the Pi, the cast icon then shows in the browser
   and
   2.1 the native videos in the example play on the PC's chrome browser
   2.2 the native videos in the example cast fine to a chromecast on my home LAN

however then if we change the media.js code for the main page to
add our own .mp4 on the Pi web server,
and specifying the default Application ID for the Receiver in CastVideos.js

3.1 the native videos in the example still play in the browser and cast fine to a chromecast on my home LAN
3.2 the Pi's .mp4 plays fine locally in the browser
3.3 using http: as the URL to the Pi's mp4, the .mp4 does not cast to the Chromecast ... the TV just displays the chromecast icon
3.4 using https: (the Pi has a self-signed cert) as the URL to the Pi's .mp4, the .mp4 does NOT cast to the Chromecast ... the TV just displays the chromecast icon

So, it looks like the chromecast device requires the .mp4 to reside on a server which has a proper signed certificate which has an authentication chain.

Does anyone know how to cast .mp4 videos from a local web server in a home LAN,
where the web server has no access in from the internet (i.e. no domain or real cert) ?

Or, other suggestions ?

I guess you could also clarify in the README.md what all of the requisite pre-conditions are for it to work.

Thank you.

Running the app-done from here doesn't work. My http-server fails with:

[Mon Nov 28 2022 00:37:41 GMT+0100 (Central European Standard Time)]  "GET /" "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/107.0.0.0 Safari/537.36"
_http_outgoing.js:470
    throw new ERR_HTTP_HEADERS_SENT('set');
    ^

Error [ERR_HTTP_HEADERS_SENT]: Cannot set headers after they are sent to the client
    at ServerResponse.setHeader (_http_outgoing.js:470:11)
    at module.exports.ResponseStream.(anonymous function) [as setHeader] (/usr/local/lib/node_modules/http-server/node_modules/union/lib/response-stream.js:100:34)
    at Object.exports.(anonymous function) (/usr/local/lib/node_modules/http-server/lib/core/status-handlers.js:57:7)
    at Readable.stream.on (/usr/local/lib/node_modules/http-server/lib/core/index.js:339:22)
    at Readable.emit (events.js:198:13)
    at emitErrorNT (internal/streams/destroy.js:91:8)
    at emitErrorAndCloseNT (internal/streams/destroy.js:59:3)
    at process._tickCallback (internal/process/next_tick.js:63:19)

When using the default android TV receiver on newer Android SDK http schemes are no longer supported by default. This causes exoplayer load problems when accessing these urls. In order to prevent load issues we should update the following string to use the https scheme:

const MEDIA_SOURCE_ROOT = 'http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/';

On Chrome Android, chromecast SDK simply doesn't work, it's not loaded at all, I have this issue also on a sender app I made, it looks like window['__onGCastApiAvailable'] is not called at all.

Actually, if you play a video in Chrome Android, a cast icon appears in the top left corner of the <video> element but it seems a Chrome native thing, not the cast button implemented in this repo.

Hi there,

I have cloned this repo and trying to cast the media from my browser, but Cast button is not visible (checked in elements & found "display: none" for it). Although it's working fine for DEFAULT_MEDIA_RECEIVER.

Steps I followed:

1. Registered my device on google cast console [status - Ready For Testing].
2. Registered Application and configured the "Application ID" into sender App (Tested for both Custom & Styled Media Receiver)
3. Deployed both Sender & Receiver applications and put the URL into cast console URLs.

Can anyone help me to know if something is missing or wrong in the above steps.
Note: Working fine for DEFAULT_MEDIA_RECEIVER & I'm connected to the same network.

Thanks

Based on the docs (https://developers.google.com/cast/docs/design_checklist/sender#sender-control-resume) I would expect this sample to pick up where it left off after a network disconnect/reconnect but it doesn't.

I would also expect it to maintain state (show info for the vid currently playing on the chromecast) after a browser refresh, rather than start casting Big Buck Bunny from the beginning.

I'm unable to have two instances of this sender running on different computers connected to the receiver simultaneously, I think this should be possible.

(Have I misunderstood the checklist requirements?)

Hello @entertailion @jtromo @ginayeh @meihua @smishra2 googlecast team!
I need you help.
Add chrome cast according to the tutorial

After adding the Chromecast button, I click it, select an available device from the network, and it is connected. The status "Streaming" is visible in the browser, in fact nothing happens, except for the following error in the console:

TypeError: Cannot read property 'loadMedia' of null

Code:

cast.framework.CastContext.getInstance().setOptions({
      receiverApplicationId: '111111',
      autoJoinPolicy: chrome.cast.AutoJoinPolicy.ORIGIN_SCOPED
  });


  var currentMediaURL =
      'https://.....';
  var contentType = 'mp4';

          var mediaInfo = new chrome.cast.media.MediaInfo(currentMediaURL,contentType);
          var request = new chrome.cast.media.LoadRequest(mediaInfo);

          console.log('Below variable -mediaInfo ');
          console.log(mediaInfo);
          console.log('Below variable -request ');
          console.log(request);

          var castSession = cast.framework.CastContext.getInstance().getCurrentSession();
           console.log('Below variable -castSession ');
          console.log(castSession);

  castSession.loadMedia(request).then(
      function () {
          console.log('Load succeed');
      },
      function (errorCode) {
          console.log('Error code: ' + errorCode);
      });

Code testing:

As I understand it, for some reason, the link to the stream is not sent. There is an interesting question, why does the link to the stream go to the variable contentid although there is a variable contentUrl?

CastVideos.js line 466 inside setVolumePosition:

volumeSliderPosition = vScale + (pos - vScale) / 2;

To reproduce:

• Cast a video
• Let the video play until the end, so it is unloaded and the player goes into IDLE state
• Clicking play will trigger a loadMedia call. Instead of clicking it once though, click it a couple of times fast.
• The video will start playing on the Chromecast, but the remotePlayer and remotePlayerController are no longer updated
  castPlayer.remotePlayer.isMediaLoaded //false

I am facing the same issue in my own sender application, and I am not sure how this has to be handled correctly. It is really annoying though, because once this issue occurs, the remotePlayer / remotePlayerController can't be 'revived', even when loading other videos or reconnecting the cast session. A page refresh is required.

I am using the code as is in this repository. The cast button does not show up if I use my application id.
Also more than 50% of the time, there is an error in the console stating

Uncaught ReferenceError: cast is not defined
at CastPlayer.initializeCastPlayer (CastVideos.js?=18:179)
at window.__onGCastApiAvailable (CastVideos.js?=18:1643)
at chrome.cast.ha (cast_sender.js:94)

What do I need to fix this issue?

Tested on 2 Chromecast devices (v1 and v2).
Sender is Chrome 54.0.2840.85 on Android 7.0.0 or 6.0.1 (cast v3).
This issue can be reproduced from the sample Chrome app here on GitHub and in our custom app.
When cast button is interacted with casting works as expected.
While casting is engaged when the cast icon from the player is interacted with one would expect casting to disengage.
Instead an overlay menu appears ("Cast to" and a waiting bar with "Finding devices"). This goes on forever and casting is never disengaged.
Casting can be disengaged using the top-down menu on Android (the one that shows when you swipe from the top of the device to the bottom). Using the stop button in this menu does work as expected.

Thanks
Arnaud

How is it possible to play next video automatically?

A few months ago, I created a ticket regarding the ChromeCast's lack of comprehensive examples and documentation. I recently resumed work on my project that worked with the ChromeCast, and I was a bit disappointed to see the documentation hasn't changed.

Based on this much better example, I solved my problem. I turned the solution into another simple example.

I did not generously comment my gist as I would expect a demo to be commented, but it wasn't originally meant to be shared. Nonetheless, it's a good starting point for comprehensible docs.

The other points in my previous ticket still apply. The current demos won't run without pulling a repository and don't explain any of what they do. They are a barrier for anyone who's tempted to develop a ChromeCast application.

In the documentation, I found this piece of code:
media.editTracksInfo(tracksInfoRequest, successCallback, errorCallback);

but I cannot find where is it instantiated or defined, since this is not a method for video/audio native tags. Can anyone provide information of how media is defined? Thanks in advance

Hi!
Should this sample app be working in Chrome on iOS?

As far as I understand the docs, there are no limitations documented regarding to iOS. Still, the cast.framework.RemotePlayer (and other classes in the cast.framework namespace) are undefined on latest Chrome (tested on iPhones and iPads running iOS 9 and iOS 10). Interestingly, cast.framework.CastContext is available and a session can be requested.

hiii,
i just downlaoded the code present in github and it is based on javascript.i executed the code it is working fine.and i just want to develop in reactjs.so i copied the same js files and pasted in reactapp.
and i am getting the error of "cast" and "chrome" undefined.

so in order to resolve this do i need to install or import any package.
please help me out this.
thankyou.