3

スタック オーバーフロー コミュニティの皆様、こんにちは。

私はかなり初心者のコーダーですが、毎日ますます複雑に見えるプロジェクトを考案しており、どこから始めればよいかわかりません。

Synchtube と Phonoblaster からインスピレーションを得て、訪問者が私がキュレーションした YouTube のビデオとプレイリストをリアルタイムで同時に同期して視聴できるようにする、私の Web サイト用の何かを作成しようとしています。

これを自分の Web サイトのコンテキストに配置できるようにしたいので、既にこれを行っている上記のサービスを使用することはできません。

このトピックについては、Stack Overflow や他のブログ ( HERE およびHERE ) でいくつか書かれています。

私はまだ初心者のプログラマーだと思っており、Google や Stack で見つけた多くの情報は 1 ~ 2 年以上前のものである傾向があるため、どこから始めればよいのか、この情報が古くなっているのかどうかはまだわかりません。具体的には、どの言語とツールを学ぶべきか。

これまでに集めたものからすると、Javascript、Node.JS、YouTube API などがその核心となるでしょう。私はこれまでこれらのいずれも使用したことがありませんが、他の経験豊富なコーダーが私に指摘できる独自の提案やアイデアを持っているかどうかを確認することに興味があります.

この記事を読んでくれてありがとう!すぐに何人かからの連絡をお待ちしています:)

どうもありがとう。

4

1 に答える 1

7

Youtube からのライブ ストリームが必要なようです。詳細については、こちらをご覧ください。https://support.google.com/youtube/bin/answer.py?hl=ja&answer=2474026

それができれば、任意の数のユーザー間で再生を同期することは、ストリームの通常の YouTube 埋め込みをブラウザーに埋め込むのと同じくらい簡単です。

それを過ぎて、任意の数のユーザー間でビデオ再生を同期したい場合、最初の大きな問題は、ビデオに時間を設定する方法を学ぶことです. 幸いなことに、ハッシュバング #t=seconds を使えば簡単です。

例: http://www.youtube.com/watch?v=m38RdUGqBPM&feature=g-high-rec#t=619sは、この HuskyStarcraft ビデオをビデオの 619 秒から開始します。

次のステップは、現在の時刻を追跡するバックエンド サーバーを用意することです。Node.js と Socket.io のセットアップは非常に簡単です。Socket.io は、長いポーリングなどを通じて Web ソケットからの同時実行接続を適切に処理し、非常に古いブラウザーでもうまく動作する素晴らしいライブラリです。Websocket は必須ではありませんが、最も最新で完全に証明された方法であることに注意してください。そうでなければ、そのハックなど。

これが機能する1つの方法は次のとおりです。

User1 がサイトにアクセスし、最初にビデオの再生を開始します。あなたのページのスクリプトがサーバーに XHR リクエストを送信します。これは、「X 時間にビデオが開始されました」というメッセージです。X は開始時刻として保存されます。

この時点で、2 つのルートに進むことができます。Youtube API を使用してクライアント側スクリプトを作成し、動画をポーリングして毎秒現在のステータスを取得できます。ステータスまたは時刻が変更された場合は、サーバーに別のリクエストを送信して状態を更新します。

もう 1 つの簡単な方法は、User2+ のページをロードしてから、ビデオの再生時間を尋ねる XHR リクエストを送信することです。サーバーは User1 からの開始時間の差を返信し、クライアント スクリプトは User2+ の YouTube プレーヤーに 't' ハッシュバンを設定します。これにより、開始時間を同期できますが、ユーザーがビデオを一時停止または巻き戻しした場合、それらの状態は更新されません。ただし、その後のページの更新でそれが行われる場合があります。

アプリケーション全体の複雑さは、必要な要件によって異なります。開始時刻がちょうど同期されている場合、ルート #2 は十分に機能するはずです。ソケットを必要とせず、jQuery または単純な JavaScript で簡単に実行できます。

すべてのユーザーがビデオを開始/停止/一時停止/早送り/巻き戻しできる、本当に同期されたエクスペリエンスが必要な場合は、確立されたライブラリ ソリューションを使用するか、独自に作成することを検討しています。

申し訳ありませんが、この回答は一種のオープンエンドですが、あなたの質問もそうでした. =)

于 2012-12-10T02:54:56.923 に答える