Google Cast
Google Cast — технология, позволяющая стримить видео и аудио с мобильного приложения на телевизоры и приставки. Приложение становится пультом управления для проигрывания, перемотки и прочих функций плеера на внешнем устройстве.
Google Cast может быть реализован «из коробки» в приставках и телевизорах, либо может подключаться к любым внешним мониторам и телевизорам с помощью так называемых «донглов» Google Chromecast.
Google Chromecast — это дополнительное устройство («донгл»), требующее подключения к телевизору (монитору) через кабель HDMI и подключение самого донгла к электрической сети. При правильной настройке устройств доступно транслировать изображение или видео с мобильного телефона (планшета) на экран телевизора. Любой доступный для просмотра в приложении Иви контент доступен также и для трансляции на большой экран с помощью Chromecast.
Google Cast — официальное расширение для Chromecast
Вчера было представлено новое устройство под названием Chromecast — чудо-штучка, которая позволяет транслировать на телевизор контент с ваших устройств. Кто не читал — прочтите хотя бы ради фотки с беконом. А сегодня мы расскажем про официальное расширение для браузера Google Chrome, которое и отвечает за взаимодействие с Chromecast.
Chromecast позволяет не только транслировать на ТВ видео и музыку из приложений для Android и iOS, но и выводить на большой экран любое содержимое вашего браузера Google Chrome. Именно для этого и создано расширение Google Cast.
Прежде всего, расширение добавляет специальные опции на поддерживаемые сервисы. Например, на YouTube или Netflix появятся кнопки, по клику на которые можно будет отправить видео на ТВ.
А самое приятное, что мы не ограничены только этими сервисами и только видео. По клику на иконку расширения вы всегда сможете поделиться полным содержимым вашего браузера. Хотите отправить на телевизор фото, документы, сайт Хром.рф, новости, онлайн-игрушку? Вперед!
В настройках можно указать качество трансляции и масштабирование изображения.
На данный момент поддерживаются версии Google Chrome для Windows и Mac.
Круто? Осталось только устройство найти (а кое-кто их уже 3 штуки заказал).
Google Chromecast: Что это такое и как оно работает? Установка и настройка
Google Chromecast — это потоковый медиаплеер, он берет контент из интернета и отображает его на вашем телевизоре.
Версия Ultra поддерживает видео 4K Ultra HD и HDR, и вы также можете использовать его с подключением Ethernet в дополнение к Wi-Fi.
Chromecast работает иначе, чем Amazon Fire TV, Roku и Apple TV и другие крупные потоковые устройства. Все эти плееры имеют экранные интерфейсы, отображающие каналы / приложения, которые можно воспроизводить через них, и все они оснащены пультами дистанционного управления для навигации по интерфейсу. С помощью Chromecast вы находите контент, который хотите смотреть/слушать/воспроизводить на своем мобильном устройстве Android или iOS или в браузере Chrome, а затем “бросаете” его на телевизор через плеер. (На самом деле вы не посылаете полный сигнал на Chromecast с вашего устройства; вы просто отправляете URL-адрес, и он берет его прямо из интернета.)
Что вы можете сделать с Chromecast?
Смотреть потоковые видео
Неудивительно,что Chromecast может транслировать видео, которые вы покупаете в магазине Google Play. Но есть много других ведущих поставщиков контента, которые также работают с ним, включая Netflix, Amazon Video, Hulu, HBO GO/HBO NOW, Sling TV, ESPN, Disney, PBS, History, YouTube, NBA и многие другие.
Важно: Покупка Chromecast не дает вам доступа к контенту, который вы можете смотреть на нем, точно так же, как покупка телевизора не дает вам доступа к кабельным телевизионным шоу. Вы должны иметь учетные записи в каждом потоковом сервисе, который предоставляет контент (некоторые бесплатные, некоторые платные) и/или подписаться на кабельный / спутниковый пакет, который дает вам разрешение на доступ к шоу из определенных сетей через Chromecast. Например, если вы платите за HBO через своего кабельного провайдера, то вы можете использовать приложение HBO GO для бесплатной трансляции своих шоу, используя свой логин кабельной компании. Если у вас нет кабеля или ваш пакет не включает HBO, вы можете приобрести услугу HBO NOW и использовать это приложение для просмотра их шоу.
Слушать потоковое аудио
Chromecast также позволяет воспроизводить музыку из нескольких популярных сервисов, включая их собственные Google Music, Pandora, Spotify и iHeart Radio.
Зеркальное отображение экранов ПК и устройств Android на телевизоре
Используя браузер Chrome на рабочем столе Windows или приложение Google Home на мобильном устройстве, вы можете зеркально отобразить весь экран на телевизор. Так, например, это позволит вам смотреть видео, которое доступно только в интернете, или читать вашу электронную почту, или отображать презентацию на экране.
Примечание: Разница между кастингом и зеркальным отображением заключается в том, что с помощью кастинга вы можете транслировать что-либо со своего компьютера, не прерывая любой контент, отправляемый на ваш телевизор. Поэтому, если я смотрю Джессику Джонс во вкладке браузера Chrome и бросаю ее в Chromecast, я могу переключиться на свою электронную почту, и видео будет продолжать воспроизводиться. С помощью зеркального отображения вы в основном просто копируете все, что отображается на экране вашего компьютера на телевизор. Поэтому, если вы переходите от одной программы к другой, то же самое произойдет и на вашем телевизоре. В Примере с Джессикой Джонс, Когда я переключаюсь на свой почтовый клиент, это то, что теперь будет отображаться на моем телевизоре.
Минусы в Chromecast
Ну, поскольку никто не совершенен, есть несколько вещей.
- Поскольку на экране нет интерфейса, вы должны знать, работает ли конкретное приложение через устройство. Тем не менее, приложение Google Home имеет функцию поиска, чтобы облегчить поиск этих приложений.
- Я сам не геймер, поэтому я могу ошибаться, но мне кажется, что список игр, которые поддерживает Chromecast, не так хорош, как некоторые другие потоковые медиа-устройства, которые предлагают популярные игры, такие как Crossy Road и Angry Birds. Кроме того, там нет игровой консоли или пульта дистанционного управления движением, так что вы определенно ограничены игрой в более случайные типы игр.
Мои пять копеек
Честно говоря, я редко использую свой Chromecast, главным образом потому, что я просто не тот, кто постоянно держит в руке мобильное устройство; я гораздо предпочитаю использовать пульт дистанционного управления, когда смотрю что-то по телевизору.
Но это, вероятно, делает меня чем-то вроде аутсайдера или, по крайней мере, немного старым. Для людей, которые используют свои телефоны или планшеты для всего, постоянно крутят их в руках, Chromecast — это очень удобный вариант по очень хорошей цене.
Кроме того, расширение браузера Chrome может быть очень удобно для таких людей, как я, которые постоянно держат свой ноутбук открытым, потому что вы можете легко смотреть видео или слушать музыку через динамики телевизора, более мощные и качественные чем у ПК.
Начало работы с Google Chromecast
Процесс настройки и использования Chromecast отличается от других плееров тем, что он не имеет собственного экранного интерфейса.
- Подключите Chromecast к телевизору и подключите его к розетке. Переключите вход телевизора на тот порт, который вы используете.
- Подключите Chromecast к интернету. Вы можете сделать это либо через приложение Google Cast на вашем телефоне или планшете Android или iOS, либо загрузив специальную утилиту на свой компьютер.
- Откройте приложения для контент-провайдера на своем мобильном устройстве. Поддерживаемые приложения будут иметь значок кастинга, который вы нажмете, чтобы отправить информацию в Chromecast.
Подключите Chromecast к телевизору и подключите его к розетке
Вставьте Chromecast в один из портов HDMI на телевизоре.
Обратите внимание на номер порта (например, HDMI 1, HDMI 2…) и используйте пульт дистанционного управления телевизором для переключения на этот вход. Вы будете знать, что находитесь на правильном канале, когда увидите на экране сообщение Chromecast setup (Первый экран установки приложения).
Примечание: Если у вас нет пульта дистанционного управления вашего телевизора, ваш кабельный / спутниковый / универсальный пульт дистанционного управления, вероятно, имеет кнопку ввода, но если это не так, то на вашем телевизоре должна быть кнопка переключения входов. Если вы хотите вернуться к обычному просмотру телевизора, используйте кнопку ввода, чтобы переключиться обратно на порт, через который ваш телевизионный сигнал поступает в телевизор.
Затем подключите mini-USB — конец шнура питания к Chromecast. Вы можете либо подключить другой конец к USB-порту телевизора, если он у вас есть, либо подключить его к входящему в комплект адаптеру для настенной розетки. Обратите внимание, что для Chromecast нет переключателя включения или выключения; он всегда включен (но использует очень мало энергии, когда он фактически не используется).
Подключите Chromecast к интернету
Когда вы переключитесь на правильный телевизионный вход, вы увидите сообщение, указывающее вам перейти к chromecast.com/setup в веб-браузере, который в основном просто говорит вам, где скачать приложение Google Cast для вашего телефона или планшета.


Как только оно будет установлено, произойдет автоматическое распознавание вашего устройства Chromecast и пойдет процесс его настройки с помощью вашей сети Wi-Fi. Инструкции предельно ясны, поэтому я не собираюсь повторять их здесь. Я настроил свой с помощью приложения Google Cast на телефоне Android. Вот несколько скриншотов, чтобы дать вам представление о том, чего ожидать, когда вы проходите через этот процесс. Некоторые из них с моего телефона, а некоторые с телевизора.
Примечание: Если у вас нет доступа к мобильному устройству, вы можете перейти по URL-адресу в браузере вашего компьютера, и он даст вам ссылку для загрузки утилиты, которая проведет вас через процесс установки.












Теперь вы можете…
Подключить к Google Chromecast контент-провайдеры, которые вы хотите смотреть/использовать
Откройте приложение, которое вы хотите посмотреть н своем телевизоре — IVI, МЕГОГОУ, Гугл Видео, Гугл Музыка, Юутб. Вы можете использовать приложение Chromecast, чтобы узнать, какие другие приложения находятся на вашем устройстве и работают с плеером.


Примечание: Вы также можете использовать приложение Google Cast для поиска других поддерживаемых приложений для установки, а также для управления настройками вашего устройства.
Скриншоты ниже взяты из приложения Netflix на телефоне Android.
Где-то на экране появится значок кастинга, обычно вверху или внизу справа.
![]()
Нажмите на это, и он откроет меню со списком всех устройств, которые он может найти, которые он может подключить. В этом случае я хочу привести к моему Chromecast 2.

Примечание: Как уже упоминалось ранее, кастинг — это не то же самое, что зеркальное отображение. Таким образом, вы ничего не увидите на своем телевизоре, пока не нажмете кнопку воспроизведения для видео, которое вы хотите посмотреть (песня, которую вы хотите слушать, игра, в которую вы хотите играть и т. д.)
Мои поздравления. Теперь вы готовы наслаждаться вашим Chromecast!
Подключение к Chromecast из браузера Google Chrome
Чтобы использовать эту функцию, вам нужна версия Chrome, в которую встроена функция кастинга. Поищите значок кастинга в правом верхнем углу браузера.
Чтобы выполнить трансляцию содержимого вкладки, на которой вы находитесь, щелкните значок «CAST» и выберите имя устройства Chromecast, на которое вы хотите выполнить приведение.

Эта страница будет отображаться на вашем телевизоре, и если на ней есть какой-либо носитель, например видео, вы можете начать воспроизводить его в Chrome, и он будет воспроизводиться на вашем телевизоре. После завершения кастинга вы можете переключиться на другие вкладки или другие приложения на вашем компьютере, и содержимое этой вкладки будет продолжать отображаться на вашем телевизоре.
Если потоковая передача низкого качества, вы можете изменить настройки, снова нажав на значок кастинга.

Вы также можете зеркально отобразить весь экран своего устройства с которого идет трансляция, щелкнув стрелку раскрывающегося списка и выбрав этот параметр. Это не похоже на кастинг; все, что вы делаете на своем компьютере, теперь будет отображаться на экране телевизора.
Издеваемся над Google Cast, или мышь для телевизора

Как только я узнал про такую замечательную вещь, как Chromecast, сразу побежал его покупать, ведь превратить свой ТВ в SmartTV (ну или на худой конец не перетыкать больше HDMI для просмотра фильмов) за две тысячи рублей — очень весёлая перспектива. Однако ещё более весёлая перспектива — это начать программировать под него.
Большинство задач для Хромкаста, которые реализуют сейчас — это простейшие приложения-видеоплееры. Форменная несправедливость для среды, которая может выполнять HTML5 на уровне свежего Хрома. Но вот незадача: нет в этой среде никаких событий мыши, что логично. Но и это не проблема для нас с вами.
Итак, для начала создадим простейшие Sender App и Reciever App. Инструкции для этого есть в официальной документации. Если коротко, то для этого вам нужно:
- Зарегистрироваться здесь, зарегистрировать свой Chromecast и своё приложение;
- Создать HTML-приложение Sender для Chrome (инструкция);
- Создать HTML-приложение Reciever для Cast-устройства (инструкция).
Есть маленький чит, который позволит вам избежать лишнего шага по заливке созданного Receiver-приложения на внешний хостинг. Когда вы зарегистрировали свой Chromecast и добавили приложение (можете зарегистрировать его на любую левую страницу на любом левом домене, главное, чтобы она открывалась), вы можете открыть дебаг вашего приложения, как описано здесь, и далее просто ввести в JS-консоли:
location.href = 'http://IP-вашего-локального-сервера/'
и открыть, таким образом, страницу Receiver-приложения с локального веб-сервера.
Ну, приступим, собственно, к самому эксперименту. Всё волшебство нашего приложения будет заключаться в том, что мы будем передавать из Хрома координаты указателя мыши с помощью стандартного метода Google Cast API для передачи сообщения. Суть в том, что соединение между Receiver и Sender приложений идёт через ваш локальный WiFi (и, судя по всему, WebSockets), поэтому задержка передачи данных минимальна.
Собственно, функция, которая творит волшебство в Sender-приложении:
function() < if (!$('body').data('casting')) < $('body').data('casting', true).on('mousemove', (function(e) < return window.session.sendMessage(namespace, < x: e.clientX, y: e.clientY >, (function() <>), (function() <>)); >).throttle(10)).on('click', function() < return window.session.sendMessage(namespace, < event: 'click' >, (function() <>), (function() <>)); >); > return; >
CoffeeScript
-> unless (body = $('body')).data 'casting' body .data 'casting', true .on 'mousemove', ((e) -> window.session.sendMessage namespace, < x: e.clientX, y: e.clientY >, (->), (->) ).throttle(10) .on 'click', -> window.session.sendMessage namespace, < event: 'click'>, (->), (->)
Волшебная функция throttle в данном случае мною позаимствована из Sugar.JS. Как многие догадались, она ограничивает вызов коллбека не чаще раза в 10 мс, чтобы не зафлудить наш Chromecast. Namespace — это просто уникальная строка, имя, которое даётся каналу данных. В моём случае это ‘urn:x-cast:com.google.cast.magnum.remote_control’.
Вызывать эту функцию нам нужно в тот момент, когда мы устанавливаем сессию связи с Cast-устройством, т.е. 1) внутри sessionListener (в случае обновления страницы, если соединение уже было установлено), а так же 2) в success-коллбеке в requestSession.
Итак, Sender теперь отправляет данные о координатах указателя мыши, осталось их как-то обработать в Receiver’е:
this.cursor = document.createElement('div'); this.cursor.style.position = 'absolute'; this.cursor.classList.add('magnum-cursor'); document.body.appendChild(this.cursor); this.messageBus = receiverManager.getCastMessageBus(this.namespace, cast.receiver.CastMessageBus.MessageType.JSON); return this.messageBus.onMessage = (function(_this) < return function(e) < if (e.data.x && e.data.y) < var element; _this.cursor.style.left = e.data.x + 'px'; _this.cursor.style.top = e.data.y + 'px'; element = document.elementFromPoint(e.data.x - 1, e.data.y - 1); if (_this.currentHover !== element) < if (_this.currentHover) < _this.currentHover.dispatchEvent(new Event('mouseleave')); _this.currentHover.classList.remove('hover'); >_this.currentHover = element; _this.currentHover.dispatchEvent(new Event('mouseenter')); return _this.currentHover.classList.add('hover'); > > else if (e.data.event) < return _this.currentHover.dispatchEvent(new Event(e.data.event)); >>; >)(this);
CoffeeScript
@messageBus = receiverManager.getCastMessageBus @namespace, cast.receiver.CastMessageBus.MessageType.JSON @messageBus.onMessage = (e) => if e.data.x && e.data.y @cursor.style.left = e.data.x + 'px' @cursor.style.top = e.data.y + 'px' # we should get neighboor pixel; otherwise we will get cursor element forever. element = document.elementFromPoint e.data.x - 1, e.data.y - 1 if @currentHover != element if @currentHover @currentHover.dispatchEvent new Event('mouseleave') @currentHover.classList.remove 'hover' @currentHover = element @currentHover.dispatchEvent new Event('mouseenter') @currentHover.classList.add 'hover' else if e.data.event @currentHover.dispatchEvent new Event(e)
receiverManager мы создаём заранее в соответствии с документацией. cursor — это просто div-элемент, который будет бегать по экрану, заменяя нам курсор. Собственно, на этом мы всё и сделали.
Полный готовый пример можно посмотреть у меня на гитхабе. Жду ваших комментариев.
P.S.: Если тема будет интересна, и если мне будет не лень, в следующем выпуске расскажу, как сделать из вашего смартфона 3D-пульт для приложения Google Cast (прямо как LG Magic Remote, и даже круче, потому что интерактивный).
- chromecast
- google cast
- smart tv
- манипулятор мышь
- JavaScript
- Google Chrome
- Google API
