TVRemotePlus
【開発終了・KonomiTV への移行を推奨】PHP / JavaScript 製のテレビのリモート視聴ソフト(いわゆるロケフリ)
Install / Use
/learn @tsukumijima/TVRemotePlusREADME
<img alt="Logo" src="docs/logo.png" width="350">
[!WARNING] 現在の master ブランチ (v2.8.0) では、Eschamali 氏による Apache 2.4.55 / PHP 8.2 対応フォーク の取り込み、テレビ東京のニコニコ実況コメントが表示されなくなった問題など、いくつか追加の修正を行っています。
なお Twitter 投稿機能は Twitter API v1.1 の廃止により動作しなくなったため、UI 上から削除しています(内部的にはそのまま)。v2.7.1 から移行するには、ファイルの更新後に
bin/Apache/conf/httpd.confを下記の通り修正する必要があります。# PHP module # LoadModule php7_module "${SRVROOT}/bin/PHP/php7apache2_4.dll" # <- この行をコメントアウト LoadModule php_module "${SRVROOT}/bin/PHP/php8apache2_4.dll" # <- この行を追加現在の TVRemotePlus は大元の作りが非常に雑なことに加え、老朽化により様々な箇所にガタが来ています。
下記に「メンテナンスモード」とある通り、現在は個人的に使い続けるための最低限の修正のみを行っています。他環境での動作は保証しません。ドキュメントの内容は 2022 年以降一切更新されていないため、随所に現状を反映していない/情報が古い記述があります。
また手間の関係でリリースは行いませんので (リリース方法を忘れた…) 、必要な方は git pull などで直接ファイルを更新してください。
PHP / JavaScript 製のテレビのリモート視聴ソフト(いわゆるロケフリ)です。
YouTube やニコニコ動画などの動画配信サービスの UI を意識した、モバイルフレンドリーなレスポンシブ Web UI が特徴です。
放送中の番組の視聴・録画番組の検索/再生・複数同時視聴などの基本機能に加え、Twitter と連携してキャプチャ付きでツイートする機能やニコニコ実況のコメントを表示 / 投稿する機能、字幕を表示する機能なども実装しています。
ダウンロードはこちら
概要
<span style="font-size: 80%; float: right;">*画像はイメージです</span>
スマホ・PC 両方での利用に最適化されたテレビ視聴ソフトを求めて開発しました。
一応、コンセプトは「動画配信サイト風の直感的で使いやすいレスポンシブ Web UI」です(実現できているかは微妙ですが…)。
機能的には TVRemoteViewer_VB と似ている部分がありますが、下記のように TVRemoteViewer_VB にはない機能、逆にこの TVRemotePlus にはない機能もあります。
また、TVRemotePlus は複数のオープンソースソフトウェア(組み込み済み)を利用して動作します。単体では動作しません。
このほか、いわゆる TS 抜き環境が事前に導入されている必要があります。
基本的にド素人が作った出来の悪い<s>クソコード</s>自己満ソフトのおすそ分けです。できる範囲で不具合は修正しますが、必ず動く保証はありません。
また、動けばいいや程度で強引に実装してしまっている箇所があるため、いろいろ不具合があるかもしれません。
ドキュメントは最新の情報に更新できていない場合があります。あらかじめご了承ください。
[!WARNING] TVRemotePlus は現在メンテナンスモードです。
これ以上の機能追加は行われないほか、アップデートがあったとしても、最低限の変更と不具合修正のみとなります。完全な開発終了ではありませんが、それに近い状態です。背景には、開発開始当初のつたない技術力で無計画に実装を進めていってしまった結果、作者自身ですら手に負えないほどのスパゲティコードになってしまったという事情があります…。
TVRemotePlus に既知の問題がいくつもあることは重々承知していますが、比較的簡単に修正できるものに関しては、v2.6.1 の時点ですでに修正を完了しています。
現在残っている不具合は、現行のコードでは修正が困難な問題か、まだ把握できていないバグかのいずれかです。
[!NOTE] 現在は KonomiTV の開発を進めています。
TVRemotePlus で実装していた機能を引き継ぎつつ、まったく新しいテレビ視聴・録画視聴のユーザー体験を作り上げ、追求したいという想いから開発しています。
まだ TVRemotePlus のすべての機能を代替できるほどにはなっていませんが、よろしければお試しください。
開発動機
「ふとんでゴロゴロしながらスマホで YouTube みたいにテレビとか録画とか見たい」
「外出先でもスマホでニュース眺めたい(ワンセグは画質悪いしアンテナとかめんどくさい)」
「ニコ生みたいにニコニコ実況のコメントを流したいしコメントもしたい」
「Twitter 実況するの割と手順が煩雑になりがちだし見ながら Twitter で実況したい」
「折角 Twitter 実況するならテレビの画面もキャプチャしてツイートしたい」
「録画見るときにもコメント流したいし YouTube みたいに簡単に見たい(ファイルを漁りたくない)」
「字幕流して放送画面と一緒にキャプチャしてリプライ用画像を量産したい」
などなど…(動機が不順すぎる)
機能

ざっくりにするつもりがかなり雑多になってしまった…
太字のところが大まかな機能(このソフトでできること)です。
載せきれていない機能もあるので、詳しく知りたい場合は リリースノート の方も参照してください。
- 放送中のテレビが見れます
- BS・CS も見れます
- YouTube Live とかニコ生を見るような感覚で視聴できます
- ピクチャーインピクチャーにも対応しています
- 対応しているブラウザは現状最新の PC 版 Edge・Chrome・Safari 、iOS / iPadOS 版 Safari のみです
- 画面の端においたミニプレイヤーでテレビを見ながら他の作業をする、といった事ができます
- Android 版 Chrome ではブラウザが非対応のため使えませんが、その代わり全画面にしてからホームボタンを押すとピクチャーインピクチャーに切り替わるようになっています
- プレイヤーをフルスクリーンにする事ができます
- 端末フルスクリーンとブラウザフルスクリーンがあり、後者はプレイヤーがブラウザの描画画面いっぱいに広がります
- 画面全体をフルスクリーンにすることもできます( iOS Safari を除く)
- Android の場合、端末フルスクリーンにすると画面が自動で横向きになります
- iOS は Screen Orientation API に対応していないため非対応です
- iOS では Safari の仕様でフルスクリーンにするとブラウザデフォルトのプレイヤーが使用されます
- そのため、コメントを表示させたい場合はブラウザフルスクリーンを使うようにしてください
- iPadOS では Fullscreen API がサポートされているため、フルスクリーンにしても通常のプレイヤーで再生できるようになっています
- スマホなどのスペックの低い端末では、端末フルスクリーンにするとコメント描画が非常に重くなることがあります
- 多くの場合、ブラウザフルスクリーンにすることで改善します
- 動作が極端に重い場合、Android の設定から[ユーザー補助サービス]が ON になっているアプリを全て OFF にしてみると軽くなるようです
- 生放送の場合は、プレイヤーの ● Live ボタンを押すと同期できます
- 仕組み上どうしても遅延してしまうのですが、このボタンを押せば遅延を最小限にする事ができます
- 再生中の番組のスクショを保存できます( PC のみ)
- プレイヤーのスクリーンショットボタンをクリックするとダウンロードできます
- これとは別に、再生中の番組をスクショして Twitter にツイートできる機能もあります(後述)
- Twitter にツイートした画像を保存できる機能もあります
- エンコードには ffmpeg・QSVEncC・NVEncC・VCEEncC が利用可能です
- 全て同梱済みのため、改めてダウンロードする必要はありません
- QSVEncC・NVEncC・VCEEncC を選択すると高速にエンコードできますが(=放送波との遅延が少なくなる)、それぞれ対応した GPU が必要になります
- デフォルトで使う BonDriver を設定できます(設定しておけば毎回 BonDriver を選ぶ必要がありません)
- デフォルトの BonDriver は地デジ用・BS/CS 用でそれぞれ設定できます
- ストリーム開始時にはデフォルト以外の BonDriver も選択できます
- 選択できる BonDriver は地デジなら地デジ用 BonDriver(_T*.dll)、BS/CS なら BS/CS 用 BonDriver(_S*.dll)と無印 BonDriver(それ以外) になります
- 現在の視聴人数を表示できます
- 視聴人数は端末ごとにカウントされます
- 長時間再生していると突然エンコードが止まってしまう事があるため、20秒経ってもストリームが更新されていない場合は自動でストリームを再起動します
- ストリーム開始に失敗した(30秒経ってもストリームが更新されない)場合は、自動でストリームを終了し配信休止中の状態に戻ります
- 何度試してもストリーム開始に失敗するときに無限ループにならないようにするためです
- 動画プレイヤーには DPlayer という JavaScript 製プレイヤーを TVRemotePlus 向けにかなり改良を加えた上でお借りしています
- フォークは tsukumijima/DPlayer にあります
- 複数のストリームを同時に配信できます
- ライブ配信を同時配信して2つのチャンネルを行き来したり、時間のかかる録画ファイルのエンコードをライブ配信を見ている間に行わせておく、といったことができます
- 今視聴しているストリームを終了するにはサイドメニューの[このストリームを終了]ボタンを、
今視聴しているストリームも含め全てのストリームを終了したい場合は[全てのストリームを終了]ボタンをそれぞれクリック or タップしてください - ストリーム番号の指定がない場合、ライブ配信の場合は現在視聴しているストリームで、ファイル再生の場合は空いているストリームでそれぞれストリームを開始します
- デフォルトは Stream 1・2・3・4 の4ストリームが用意されていて、4ストリームを全て使い切っているときのみ Stream 5 以降が順次利用可能になります
- それぞれのストリームをクリック or タップすると、そのストリームの視聴画面に遷移します
- 赤いストリーム終了ボタンをクリック or タップすると、そのストリームのみストリーム終了することができます
- ストリームが Offline になった場合は、自動でストリーム一覧から消去されます
- 録画した番組も見れます
- TS ファイル・MP4 ファイル・MKV ファイルの再生に対応しています
- YouTube のような感覚で録画番組を再生できます
- 録画番組の名前順・日付順のソートができます
- 録画が新しい順・録画が古い順・名前昇順・名前降順で並び替えができます
- 再生履歴を表示できます
- 再生履歴の保存件数は設定から変更できます(デフォルトは10件です)
- 番組のタイトルでキーワード検索することもできます
- 検索結果も 録画が新しい順・録画が古い順・名前昇順・名前降順で並び替えできます
- MP4・MKV ファイルはプログレッシブダウンロード機能が使えます
- エンコードせずに生の MP4・MKV ファイルをそのまま再生する事ができる機能です
- 最初から最後まで再生できる・再エンコードしないのでそのままの画質で再生できる・再生が安定している などのメリットがあります
- 一方、ブラウザが対応していない H.265 などのコーデックでエンコードされている場合は映像が再生できない場合があります
- MKV ファイルは PC / Android の Chrome でしか再生できません
- 初回インストール時のみ、リスト更新に時間がかかることがあります
- これはサムネイルや番組情報をバックグラウンドで取得しているためです
- リスト更新処理はバックグラウンドで動くため、タブを閉じても問題ありません
- 初回インストール時点での録画ファイルの量が多いほど、リスト更新に時間がかかります
- 初回のリスト更新が終われば、リストをリセットしない限り、今後リスト更新に時間がかかることはありません
- 長くても10秒程度で終わるはずですが、長い間ファイル再生ページを開かなかった場合は処理するファイルも増えるため少し時間がかかることもあります
- ファイルリストの内容がおかしくなった場合は、右上のメニューから[リストをリセット]をクリック・タップすると、リストをリセットできます
- 番組情報は再度取得し直しますが、サムネイルはリセットされません
- 最近流行りのダークモードにできます
- 個人設定から[ダークモード]をオンにするとダークモードに変わります
- 割とカッコよくて良いと思います(私はいつもダークモードで使っています)
- 初回読み込み時には端末のテーマに合わせてダークモードか通常モードか選択されます
- 局ロゴを表示できます
- 局ロゴを表示する場合は EDCB_Material_WebUI で局ロゴが表示できる状態にしておいてください
- EDCB_Material_WebUI の局ロゴ API を利用しています
- 局ロゴを表示するかどうかは[個人設定]→[番組表に局ロゴを表示]から変更できます
- 局ロゴを表示する場合は EDCB_Material_WebUI で局ロゴが表示できる状態にしておいてください
- ナビゲーションメニューを垂直に表示できます
- 横長のビューポートでもっとプレイヤーを大きくしたいのに上のヘッダーが邪魔で横の余白だけ余ってるって事があるかと思いますが、そういう時に使うとプレイヤーをより大きく表示できます
- お使いの PC やタブレットの画面レイアウトに応じて適宜設定してみてください
- 災害時などに表示されるL字画面をクロップして隠せます
- ︙サブメニュー → [L字画面のクロップ] から設定できます
- 台風などの災害時でL字画面がうざったい場合などに使えそうです
- ニコニコ実況のコメントが流せます
- 2020/12/16 からのニコ生に移行した新しいニコニコ実況にも v2.4.0 以降から対応しています
- ニコニコ実況 過去ログ API を利用し、今までの過去ログも録画番組と一緒に楽しめます
- プレイヤーの設定からオフにもできます
- 色コメや上・下固定にも対応しています
- 改造元の動画プレイヤーの兼ね合いで、文字サイズは今のところ再現できていません
- コメントの透明度も調整できます
- ニコニコ実況にコメントを投稿することもできます
- ただし、コメントを投稿する場合は環境設定からニコニコにログインするメールアドレス・パスワードを設定しておく必要があります
- ファイル再生時はコメントを投稿できません
- 2020/12/16 からのニコ生に移行した新しいニコニコ実況にも v2.4.0 以降から対応しています
- Twitter 実況が簡単にできます
- Twitter 実況機能を使う場合は、予め Twitter API の開発者アカウントを作成しておく必要があります(詳しくはこちら)
- 動画プレイヤーの下にあるフォームから番組を見ながら Twitter 実況できます
- ハッシュタグ欄に実況する番組のハッシュタグタグを書いておけば、ツイート後にいちいちハッシュタグを再入力する手間を省けます
- 放送中の番組をキャプチャ(スクショ)して画像付きで Twitter に投稿できます
- ニコニコ実況のコメントを合成した画像をツイートすることもできます
- 字幕(後述)をオンにしているときは字幕も一緒に合成されます
- キャプチャは最大4枚まで添付してツイートできます
- キャプチャ画像リストの画像を右クリック or 長押しすると画像を拡大表示できます
- Twitter に投稿したキャプチャ画像はデフォルトでは
C:\(TVRemotePlusをインストールしたフォルダ)\data\uploadに保存されます- 設定から画像の保存場所を変えることもできます
- 投稿後に画像を削除するよう設定することもできます
- ハッシュタグ を 1 分以内に Twitter API 経由で連投するとほぼ確実に Twitter 側からシャドウバンされるため、1 分以内にハッシュタグ付きツイートを連投した場合にハッシュタグを除去してシャドウバンを防止する機能もついています(詳細は後述のトラブルシューティングの項を参照)
- 必要ない場合は設定からオフにできますが、確実にシャドウバンされやすくなります
- 字幕を表示できます
- aribb24.js を利用し字幕を表示できます
- aribb24.js は、b24.js を参考に字幕を Canvas を用いてできるだけ正確に描画できるライブラリです
- TVTest の TVCaptionMod2 と同様かそれ以上の再現度を誇ります
- 自力ではとても実装できないような完成度で、要望に対応していただいたりも含め本当にありがたいです
- v2.6.0 以降では、iOS / iPadOS 端末でも字幕が表示できるようになりました!
- aribb24.js は、b24.js を参考に字幕を Canvas を用いてできるだけ正確に描画できるライブラリです
- 字幕はストリーム開始時に字幕をオンにした場合にのみ表示できます
- デフォルトはライブ配信・ファイル再生ともに字幕オンになっています
- 別途プレイヤー側で字幕のオン・オフを設定できます
- aribb24.js を利用し字幕を表示できます
- ネイティブアプリのように使うことができます( PWA 機能・後述)
- PWA は、Web アプリをあたかもネイティブアプリのように使えるようにすることができる新しい仕組みのことです
- インストールするとアプリアイコンから TVRemotePlus を起動できるようになるほか、ブラウザのアドレスバーが表示されないためより見やすくなります
- PWA 機能を利用する場合は、予め各端末に自己署名証明書をインストールし、HTTPS で TVRemotePlus
Related Skills
node-connect
347.2kDiagnose OpenClaw node connection and pairing failures for Android, iOS, and macOS companion apps
frontend-design
108.0kCreate distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, or applications. Generates creative, polished code that avoids generic AI aesthetics.
openai-whisper-api
347.2kTranscribe audio via OpenAI Audio Transcriptions API (Whisper).
qqbot-media
347.2kQQBot 富媒体收发能力。使用 <qqmedia> 标签,系统根据文件扩展名自动识别类型(图片/语音/视频/文件)。
