2017-08-23 7 views
1

StackOverflow!html要素をライブで更新するにはどうすればよいですか?

私は現在、ウェブページを通じて音楽をリクエストし、その音楽をホストを通して再生できるプロジェクトに取り組んでいます。たとえば、プロジェクトをRaspberry Piで実行していた場合は、Webインターフェイスを通じて音楽を要求し、要求リストに追加されます。私は、ボトルモジュールを使用してこれをPythonで作成する予定です。これを念頭に置いて、現在の曲のタイトルを表示するライブ再生中の要素を欲しいです。また、ユーザーが次に来る曲を見ることができ、このリストがライブで更新される場合は、私はそれを希望します。たとえば、次の曲が再生リストの一番上の曲の再生を開始すると、「Now Playing」領域のコンテンツになり、プレイリスト全体がブラウザで変更されます。また、ユーザーが新しい曲をリクエストすると、リアルタイムでプレイリストの一番下に追加されます。この方法では、ユーザーはページを更新して更新を表示する必要はありません。

私は彗星の使用についてオンラインで読んでいますが、ボトルとPythonでこれを行うことについてはあまり見つけられませんでした。これを行う方法はありますか?もしそうなら、誰かが私に何らかの形で使われているという例に私を導くことができますか?私はJavaScript(または一般的なWeb開発)を使って多くの経験を持っていませんが、私はPythonでもっと快適です。私はhtmlでうまくいくので、いくつかの基本的なWebページを作成することができます。以前はWebインターフェイスを使っていましたが、ライブの統計情報はありませんでした(プレイリストや "Now playing"フィールドのように)。もしPythonで簡単にできる答えがあれば、私はそれを好きです!

ありがとう!

+0

コードはありますか?もしそうなら、あなたの質問に投稿してください。そうでない場合は、コードを入力してからこの質問を投稿してください。 – Adi219

+1

ページが読み込まれると、Pythonはあまり手伝ってくれません。あなたはおそらく、ajaxを使って、更新された情報のためにあなたのサーバにヒットする必要があります。これは、Pythonを通して提供されるが、それを得るためにはajaxを経由するだろう。肯定的ではありませんが、少なくともその道を追求してください。 (ある時点でjsが必要になります) –

+0

@OPフロントエンドにリスナーが必要です。何が更新されるのかを決めるには、さまざまなツールや技術があります。 –

答えて

1

あなたが探しているものはWebSocketsです! :)彼らはこの状況で非常にうまくいくでしょう。ボトル用のwebsocketサーバパッケージがあります。gevent-websocketと呼ばれています。ボトルのdocsにあるボトルhereでこれを使用する簡単なチュートリアルを見つけることができます。いくつかの行でjsにwebsocketクライアントを書くのは非常に簡単なはずです(自分でこれをやったことがあります)。これにもmdn tutorialがあります。

+0

これまでのところ私のプログラムでは( "/ ws"のように)Webソケットサーバーをルートとして実行していました。表示し、現在再生中のトラックとプレイリストをクライアントに送信するためにWebソケットを使用し、次にこれをhtmlリストに表示しますか? –

+0

@GamingWithAltitudeあなたはそれが正しいです!私が言及しているmdnの記事は、[ここ](https://developer.mozilla.org/en-US/docs/Web/API/WebSockets_API/Writing_WebSocket_client_applications)です。希望が役立ちます。 – MustacheMoses

関連する問題