[解決済み] クライアントでNetflix Cadmiumビデオプレーヤーと対話する方法は?
質問
私はNetflixのアカウントを持っており、Google Chrome内で動作するビデオプレーヤーのフードの下を覗いてみました。NetflixはそのビデオプレーヤーをCadmiumと呼び、javascriptは再生、停止、一時停止、ミュートなど、期待されるすべての関数とイベントハンドラを公開しています。私は、これらのCadmiumプレーヤーの機能を呼び出すことができる小さなChrome拡張機能を作っていますが、私にとって難しいのは、プレーヤーのインスタンスを作成し、呼び出しを開始できるようにする方法を見つけ出すことです。javascriptは大きく、複雑で、やや不明瞭です。一度、そのプレーヤーのインスタンスを作成することができれば、関数を呼び出すことは簡単になると思います。
以下は、関連するjsの塊です。
muteOn: function() {
this.savedVolume = this.getVolume(),
this.updateVolumeDisplay(0),
this.scrubber.updatePercent(0),
this.muted = !0,
this.videoPlayer.setMuted(this.muted)
}
Chromeの開発ツールで、そのブロック内にブレークポイントを設定することができ、netflixのビデオプレーヤーでミュートボタンをクリックすると、実行がブレークポイントにヒットします。Netflixのjsは(当然ながら)メソッド名の変更によって大きく難読化されています。デバッガでコードをステップしてみましたが、100のウサギの穴に落ちてしまい、ユーザーがミュートボタンをクリックするのをシミュレートするために同じ呼び出し(スタックの一番上)を行う方法を見つけることができませんでした。私はまた、プログラム的にUIプレーヤーのミュートボタンをクリックするというアプローチも試しましたが、これも同様に私のニーズを満たすものでした。
10万行以上のjavascriptがあり、どの部分がこの記事に関係するのか不明なので、ChromeでNetflixを読み込み、開発ツールを開いて映画を再生し、一時停止またはミュートボタンを検査することを提案したいと思います。これらのビデオプレーヤーのコントロールとインタラクトすると、javascript の迷路に入り込むことになります。もうひとつ重要なのは、再生中のビデオの現在の経過時間を判断するために、ビデオ・プレーヤーに問い合わせる方法を見つけ出すことです。
どうすればこのナッツを割ることができるのか、何かアイデアはありませんか?(ありがとうございます!)。
解決方法は?
Chromeで、HTML 5のビデオを再生しています。
を掴んだら
<video>
タグの要素を使用すると
HTML 5 動画 API
:
を取得します。
<video>
要素
var video = document.evaluate('//*[@id="70143639"]/video',document).iterateNext()
70143639
は動画の ID で、次のようになります。
https://www.netflix.com/watch/70143639
残り時間(HH:mm)
document.evaluate('//*[@id="netflix-player"]/div[4]/section[1]/label', document).iterateNext().innerHTML
経過時間(秒)
video.currentTime
経過時間の更新
video.addEventListener("timeupdate",
function(e) {
console.debug("Seconds elapsed: ", e.timeStamp/1000/60);
}
);
と同じ結果は得られないことに注意してください。
video.currentTime
その差分をオフセットとして使用する必要があるかもしれません。また、仕様で説明されていることかもしれません。
https://www.w3.org/TR/html5/embedded-content-0.html
プレイ
video.play();
一時停止
video.pause();
時間を前後させる
提供
反逆者
:
netflix.cadmium.UiEvents.events.resize[1].scope.events.dragend[1].handler(null, {value: 600, pointerEventData: {playing: false}});
ここで
600
はシークする秒数です。
なお、私はこれを使って "Whoops, something went wrong..." に遭遇しています。
video.currentTime += 60;
一時停止や再生呼び出しでも これが このデモページ を読む必要はありません。 シークに関する完全な仕様 .
ミュートとミュート状態の取得
video.muted = true
のように
video.currentTime
これは書き込み可能なプロパティです。
関連
-
vue for 登録ページ効果 vue for sms 認証コードログイン
-
Vueの「データを聴く」原則を解説
-
[解決済み】「X-Frame-Options」を「SAMEORIGIN」に設定したため、フレームでの表示を拒否された。
-
[解決済み】JavaScriptエラー(Uncaught SyntaxError: Unexpected end of input)
-
[解決済み] JavaScriptで現在のURLを取得する?
-
[解決済み] JavaScriptで要素のクラスを変更するにはどうすればよいですか?
-
[解決済み] ページを再読み込みせずにURLを変更するにはどうすればよいですか?
-
[解決済み] JavaScriptで現在の日付を取得するには?
-
[解決済み] jQueryでページを更新するにはどうすればよいですか?
-
[解決済み] コンテンツスクリプトを使用して、ページコンテキスト変数と関数にアクセスする
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
JSアレイループと効率解析の比較
-
Vueにシンプルなメモ帳機能を実装
-
vueディレクティブv-bindの使用と注意点
-
vueが定義するプライベートフィルタと基本的な使い方
-
vueのプロジェクトでモックを使用する方法を知っていますか?
-
Vueのフィルタの説明
-
[解決済み】React Uncaught Error: 対象コンテナが DOM 要素でない [重複]。
-
モジュールのビルドに失敗しました。Error: ENOENT: no such file or directory, scandir 'D:\.... \node_modules
-
JavaScriptのgetElementById、getElementsByTagNam、getElementsByClassNameの違いと使い方
-
JavaScriptのgetElementById()メソッド入門