リアルタイムデータベース

parse server live queryの使い方 はじめに ライブクエリは、 リアルタイム反応型アプリケーション で使用されることを目的としており、従来のクエリパラダイムを使用するだけでは、応答時間の増加や高いネットワークおよびサーバー使用量など、いくつかの問題を引き起こす可能性があります。ライブクエリは、データベースから新しいデータが継続的にページを更新する必要がある場合に使用されるべきであり、これはオンラインゲーム、メッセージングクライアント、共有のto doリストなどでよく発生しますが、これに限りません。 このセクションでは、back4appを通じてjavascript環境でback4appのライブクエリを使用する方法を説明します。 このチュートリアルでは、例として、ライブクエリを使用して todo online list を構築します。以下に示します 完全な todo online list プロジェクトは ライブクエリtodoリストプロジェクト をご覧ください。 parse sdkの詳細は javascript sdk apiリファレンス と javascript sdkのためのparseオープンソースドキュメント をご覧ください。 前提条件 このチュートリアルを完了するには、次のものが必要です： back4appに接続された基本的なjavascriptアプリまたは ライブクエリtodoリストプロジェクト が必要です。 注： 私たちの javascriptインストールparse sdk チュートリアルで作成したアプリを使用するか、 ライブクエリtodoリストプロジェクト を使用できます。 十分な知識が必要です javascript parseクエリ （必須ではありません）。 1 ライブクエリを有効にする コーディングを始める前に、live queryを有効にするためにデータベースにクラスを持っている必要があります。そのためには、単にあなたのアプリを見つけて、 back4appのウェブサイト をクリックし、 ダッシュボード ダッシュボード > クラスを作成 クラスを作成 をクリックします。以下のようになります 注意 ここで、このクラスは メッセージ メッセージ と呼ばれます。 さて、live query機能を有効にするために、 back4appのウェブサイト にログインし、アプリを見つけて、 アプリ設定 アプリ設定 > サーバー設定 サーバー設定 をクリックします。「サーバーurlとlive query」ブロックを探し、「 設定 設定 をクリックします。 「サーバーurlとlive query」ブロックはこのようになります 次に、以下のようなページに到着します。このページでは、 back4appサブドメインを有効にする back4appサブドメインを有効にする オプション、 ライブクエリを有効にする ライブクエリを有効にする オプション、およびライブクエリを有効にしたいすべてのクラスをチェックする必要があります。以下のように ライブクエリを使用するには、サブドメインを有効にする必要があります。これはライブサーバーとして機能します。 2 クエリに登録する ライブクエリを使用するには、まず livequeryclient livequeryclient を作成する必要があります。これがwebsocket接続を管理します。これを行うには、アプリケーションid、検証用のjavascriptキー、および前のステップで設定したドメインであるサーバーurlを提供する必要があります。 こちらが livequeryclient livequeryclient のコードです。 livequeryclient js 1 var client = new parse livequeryclient({ 2 applicationid 'your app id here', 3 serverurl 'wss\ //' + 'your domain here', // example 'wss\ //livequerytutorial back4app io' 4 javascriptkey 'your javascript key here' 5 }); 6 client open(); 上記の手順に従った後、サブスクライブしたいオブジェクトのタイプに対してクエリを作成する必要があります。サブスクリプションは、クエリを満たすオブジェクトに変更があったときにイベントを発火させるイベントエミッターです。 この例では、基本的なクエリを作成し、すべての変更をサブスクライブします。 todo todo オブジェクトに対して。 クエリについての詳細は、 parse公式クエリドキュメント をご覧ください。 以下は querysubscribe querysubscribe のコードです。 querysubscribe js 1 var query = new parse query('todo'); 2 query ascending('createdat') limit(5); 3 var subscription = client subscribe(query); 3 イベントをリッスンする セットアップが完了したので、イベントが発火したときにアプリが何をするかをコーディングする必要があります。 この部分では、実際の例でこれらのイベントをリッスンする方法を示します。 「 todo online list 」の例は、使用されるボイラープレートコードがほとんどないため、あなたのプロジェクトのガイドラインとして役立ちます。 ここで使用する主な2つのイベントは、 create create イベントと delete delete イベントです。イベントの完全なリストは、 こちら で見つけることができます。 3 1 作成イベント 「 createevent createevent 」は、 parseobject parseobject が作成され、挿入したクエリ制約を満たすたびに発火します。このイベントは作成されたオブジェクトを返します。 「 todo online list 」の例では、アクティビティの配列は「 this todos this todos 」変数に保存され、作成イベントが発生したときにこの配列にデータベースの新しいオブジェクトを追加します。 「 createevent createevent 」のコードは以下の通りです createevent js 1 subscription on('create', todo => { 2 this todos add(todo); 3 console log('on create event'); 4 }); 3 2 削除イベント 既存の parseobject parseobject がデータベースから削除されると、このイベントが発生し、削除されたオブジェクトが返されます。 「 todo online list 」の例では、データベースから削除されるたびにリストからオブジェクトを削除する必要があります。削除されたオブジェクトを特定するために、サーバーとコードの間で一致するidを探してください。 「 deleteevent deleteevent 」のコードは以下の通りです deleteevent js 1 subscription on('delete', todo => { 2 this todos foreach(t => { 3 if (t id === todo id) { 4 console log('on delete event'); 5 this todos delete(t); 6 } 7 }); 8 }); 完了しました！ この時点で、リアルタイムの反応型アプリケーションを作成するためにlive queriesを使用する方法を知っています。 また、back4appを使用して正しいlive queryの設定を行う方法も知っており、アプリに実装を開始できます。