クイックスターターズ

MeteorJSのバックエンドを構築する方法は?

45min

イントロダクション

このチュートリアルでは、Back4Appを使用してMeteorJSアプリケーションの完全なバックエンドを構築する方法を学びます。

データベース管理、Cloud Code Functions、RESTおよびGraphQL API、ユーザー認証、リアルタイムクエリ(ライブクエリ)など、Back4Appの重要な機能を統合する方法を説明し、MeteorJSアプリケーションとシームレスに通信する安全でスケーラブル、かつ堅牢なバックエンドを作成します。

また、Back4Appの迅速なセットアップと直感的な環境が、サーバーやデータベースを手動で構成するのに比べて、時間と労力を大幅に削減できることを確認します。

その過程で、高度なセキュリティ機能、Cloud Jobsを使用したタスクのスケジューリング、外部統合のためのWebhookの設定など、主要な機能に関する実践的な経験を得ることができます。

このチュートリアルの終わりまでには、この基盤となるセットアップを本番環境に適したアプリケーションに拡張する準備が整い、必要に応じてカスタムロジックやサードパーティAPIを簡単に組み込むことができるようになります。

前提条件

このチュートリアルを完了するには、次のものが必要です:

  • Back4Appアカウントと新しいBack4Appプロジェクト Back4Appの始め方。 アカウントを持っていない場合は、無料で作成できます。上記のガイドに従ってプロジェクトを準備してください。
  • 基本的なMeteorJS開発環境 Meteorがインストールされていることを確認してください。インストールされていない場合は、Meteorインストールガイドを参照してください。
  • Node.js(バージョン14以上)がインストールされていること ローカル開発サーバーを実行するためにNode.jsが必要です。Node.jsのインストール
  • JavaScriptと基本的なMeteorJSの概念に精通していること MeteorJS公式ドキュメント。 Meteorが初めての場合は、始める前に公式ドキュメントまたは初心者向けのチュートリアルを確認してください。

始める前に、これらの前提条件がすべて整っていることを確認してください。Back4Appプロジェクトが設定され、ローカルのMeteorJS環境が準備されていると、より簡単に進めることができます。

ステップ1 – Back4Appプロジェクトの設定

新しいプロジェクトを作成する

Back4App上でMeteorJSバックエンドを構築する最初のステップは、新しいプロジェクトを作成することです。まだ作成していない場合は、次の手順に従ってください:

  1. Back4Appアカウントにログインする.
  2. 「新しいアプリ」ボタンをクリックする Back4Appダッシュボードで。
  3. アプリに名前を付ける(例:「Meteor-Backend-Tutorial」)。
Document image


プロジェクトが作成されると、Back4Appダッシュボードにリスト表示されます。このプロジェクトは、このチュートリアルで説明するすべてのバックエンド設定の基盤となります。

Parse SDKを接続する

Back4Appは、データを管理し、リアルタイム機能を提供し、ユーザー認証を処理するためにParseプラットフォームに依存しています。MeteorJSアプリケーションをBack4Appに接続するには、parse npmパッケージをインストールし、Back4Appダッシュボードの資格情報で初期化する必要があります。

Parseキーを取得する: Back4Appダッシュボードで、アプリの「アプリ設定」または「セキュリティとキー」セクションに移動して、アプリケーションIDJavaScriptキーを見つけます。ParseサーバーURL(通常はhttps://parseapi.back4app.comの形式)も見つかります。

Document image


Parse SDKをインストールする MeteorJSプロジェクトに:

Bash


MeteorJSアプリケーションでParseを初期化する:

スタートアップファイルまたは設定ファイル(例: parseConfig.js)をMeteorが早く読み込むフォルダー(例えば imports/ または client/compatibility/)に作成できます。一つのオプションは、このコードを imports/startup/client/parseConfig.js または同様に関連するパスに置くことです:

imports/startup/client/parseConfig.js


このファイルは、Meteorアプリの他の場所でParseをインポートするたびに、特定のBack4Appインスタンスに接続するように事前設定されていることを保証します。

このステップを完了することで、あなたのMeteorJSフロントエンド(および/またはサーバー)とBack4Appバックエンドの間に安全な接続が確立されました。すべてのリクエストとデータトランザクションは、このSDKを通じて安全にルーティングされ、手動のRESTまたはGraphQL呼び出しの複雑さが軽減されます(必要に応じてそれらを使用することもできます)。

ステップ2 – データベースの設定

データの保存とクエリ

Back4Appプロジェクトが設定され、Parse SDKがMeteorアプリに統合されたので、データの保存と取得を開始できます。レコードを作成する最も簡単な方法は、 Parse.Object クラスを使用することです:

JS


また、Back4AppのREST APIエンドポイントを使用することもできます:

Curl


Back4AppはGraphQLインターフェースも提供しています:

GraphQL


これらの多様なオプションにより、Parse SDK、REST、またはGraphQLを通じて、開発プロセスに最も適した方法でデータ操作を統合できます。

スキーマ設計とデータ型

デフォルトでは、Parseは スキーマを動的に作成することを許可します, ただし、より多くの制御のためにBack4Appダッシュボードでクラスとデータ型を定義することもできます。

  1. Back4Appダッシュボードの「データベース」セクションに移動します
  2. 新しいクラスを作成します(例:「Todo」)を作成し、タイトル(String)やisCompleted(Boolean)などの関連する列を追加します。
新しいクラスを作成
新しいクラスを作成


Back4Appはさまざまなデータ型もサポートしています: String, Number, Boolean, Object, Date, File, Pointer, Array, Relation, GeoPoint, そして Polygon. 各フィールドに適切な型を選択できます。希望する場合は、Meteorアプリからオブジェクトを最初に保存するときにParseが自動的にこれらの列を作成することもできます。

列を作成
列を作成


Back4Appはデータモデルを設計するのに役立つAIエージェントを提供しています:

  1. アプリダッシュボードまたはメニューからAIエージェントを開きます
  2. データモデルを説明します 簡単な言葉で(例:「新しいToDoアプリをback4appで完全なクラススキーマで作成してください。」)。
  3. AIエージェントにスキーマを作成させます.
Document image


AIエージェントを使用すると、データアーキテクチャの設定時に時間を節約でき、アプリケーション全体で一貫性を確保できます。

リレーショナルデータ

リレーショナルデータがある場合—たとえば、複数のCategoryオブジェクトが複数のTodoアイテムを指している場合—ParseでPointersまたはRelationsを使用できます。たとえば、Categoryへのポインタを追加することができます。

JS


クエリを実行する際には、ポインタデータも含めることができます。

JS


このinclude('category')呼び出しは、各Todoと一緒にカテゴリの詳細を取得し、リレーショナルデータをシームレスにアクセス可能にします。

ライブクエリ

リアルタイムの更新のために、Back4AppはLive Queriesを提供します。MeteorJSアプリでは、特定のクラスの変更にサブスクライブできます。

  1. Back4AppダッシュボードのアプリのServer SettingsLive Queriesを有効にします。「Live Queries」がオンになっていることを確認してください。
  2. コード内でLive Query Subscriptionを初期化します:
imports/startup/client/parseConfig.js

JS


購読することで、新しいTodoが作成、更新、または削除されるたびにリアルタイム通知を受け取ります。この機能は、複数のユーザーがページをリフレッシュせずに最新のデータを確認する必要があるコラボレーション型または動的なアプリに特に価値があります。

ステップ3 – ACLとCLPを使用したセキュリティの適用

Back4Appのセキュリティメカニズム

Back4Appは、 アクセス制御リスト (ACL)クラスレベルの権限 (CLP) を提供することでセキュリティを真剣に考えています。これらの機能により、オブジェクトまたはクラスごとに誰がデータを読み書きできるかを制限でき、認可されたユーザーのみがデータを変更できるようにします。

Document image


アクセス制御リスト (ACL)

ACLは、どのユーザー、役割、または一般の人々が読み書き操作を行えるかを決定するために、個々のオブジェクトに適用されます。例えば:

JS


オブジェクトを保存すると、それには指定されたユーザー以外の誰も読み取りまたは変更できないようにするACLがあります。

ACLを編集
ACLを編集


クラスレベルの権限 (CLP)

CLPは、クラス全体のデフォルトの権限を管理します。たとえば、クラスが公開されているか書き込み可能か、または特定の役割のみがアクセスできるかどうかです。

  1. Back4Appダッシュボードに移動, アプリを選択し、データベースセクションを開きます。
  2. クラスを選択(例:「Todo」)。
  3. クラスレベルの権限タブを開きます。
  4. 「認証が必要」などのデフォルトを設定します。読み取りまたは書き込み用、または「公開にアクセス不可」。
Document image


これらの権限はベースラインを設定し、ACLは個々のオブジェクトの権限を微調整します。堅牢なセキュリティモデルは通常、CLP(広範な制限)とACL(オブジェクトごとの細かい制限)を組み合わせます。詳細については、アプリセキュリティガイドライン。

ステップ4 – クラウドファンクションの作成とデプロイ

クラウドコードは、Parse Server環境の機能で、サーバー側でカスタムJavaScriptコードを実行できるようにします。サーバーやインフラを管理する必要はありません。クラウドコードを書くことで、Back4Appバックエンドを追加のビジネスロジック、検証、トリガー、および安全かつ効率的にParse Server上で実行される統合で拡張できます。

動作の仕組み

クラウドコードを書くときは、通常、JavaScript関数、トリガー、および必要なNPMモジュールをmain.js(またはapp.js)ファイルに配置します。このファイルはBack4Appプロジェクトにデプロイされ、Parse Server環境内で実行されます。これらの関数とトリガーはサーバー上で実行されるため、機密ロジックを処理したり、敏感なデータを処理したり、バックエンド専用のAPI呼び出しを行ったりすることを信頼できます。これらのプロセスは、クライアントに直接公開したくないかもしれません。

あなたのBack4AppアプリのすべてのCloud Codeは、Back4Appによって管理されているParse Server内で実行されるため、サーバーのメンテナンス、スケーリング、またはプロビジョニングについて心配する必要はありません。main.jsファイルを更新してデプロイするたびに、実行中のParse Serverは最新のコードで更新されます。

main.jsファイル構造 典型的な main.js には次のような内容が含まれる場合があります:

  1. 必要なモジュールのためのRequire ステートメント(NPMパッケージ、組み込みNodeモジュール、または他のクラウドコードファイル)。
  2. Cloud関数の定義 を使用して Parse.Cloud.define().
  3. トリガー 例えば Parse.Cloud.beforeSave(), Parse.Cloud.afterSave(), など。
  4. インストールしたNPMモジュール(必要に応じて)。例えば、HTTPリクエストを行うために axios のようなパッケージをインストールすることがあります。その後、ファイルの先頭でそれをrequire(またはimport)できます。
JS


NPMモジュールをインストールして使用する能力により、Cloud Codeは非常に柔軟になり、外部APIとの統合、データ変換の実行、または複雑なサーバーサイドロジックの実行が可能になります。

典型的な使用例

  • ビジネスロジック: 例えば、複数のオブジェクトプロパティを集約してゲーム内のユーザーのスコアを計算し、そのデータを自動的に保存することができます。
  • データ検証: レコードを保存または削除する前に、特定のフィールドが存在することやユーザーが正しい権限を持っていることを確認します。
  • トリガー: データが変更されたときにアクションを実行します(例:ユーザーがプロフィールを更新したときに通知を送信)。
  • 統合: サードパーティのAPIやサービスと接続します。例えば、Cloud Codeから直接支払いゲートウェイ、Slack通知、またはメールマーケティングプラットフォームと統合することができます。
  • セキュリティ強化: Cloud Code関数内で入力パラメータを検証およびサニタイズすることで、追加のセキュリティ層を追加します。

関数をデプロイする

以下は、クライアントから送信されたテキスト文字列の長さを計算するシンプルなCloud Code関数です。

main.js


デプロイするには、Back4App CLI:

1 - CLIをインストールする:

  • Linux/MacOSの場合:
Bash

Bash


3 - クラウドコードをデプロイする:

Bash


ダッシュボードを通じてデプロイする:

  1. アプリのダッシュボードで、クラウドコード > 関数に移動します。
  2. 関数をmain.jsエディタにコピー/ペーストします。
  3. デプロイ」をクリックします。
Document image


関数を呼び出す

MeteorJSを使用してParse SDKから(例えば、クライアントメソッドやユーザーアクションの後に):

JS


REST経由でも呼び出すことができます:

Curl


またはGraphQL経由で:

GraphQL


この柔軟性により、MeteorJSアプリやRESTまたはGraphQLをサポートする他のクライアントにカスタムロジックを統合することができます。

ステップ5 – ユーザー認証の設定

Back4Appにおけるユーザー認証

Back4Appは、Parse Userクラスを認証の基盤として活用しています。デフォルトでは、Parseはパスワードのハッシュ化、セッショントークン、セキュアストレージを処理します。つまり、複雑なセキュリティフローを手動で設定する必要はありません。

ユーザー認証の設定

MeteorJSアプリケーションでは、次のように新しいユーザーを作成できます:

JS


REST経由でのログインは次のようになります:

Bash


セッション管理

ログインに成功すると、Parseはユーザーオブジェクトに保存されるセッショントークンを作成します。あなたのMeteorJSアプリでは、現在ログインしているユーザーにアクセスできます:

JS


Parseはバックグラウンドでトークンベースのセッションを自動的に処理しますが、手動で管理または取り消すこともできます。これは、ログアウトする必要があるときに便利です:

JS


ソーシャルログイン統合

Back4AppとParseは、追加のパッケージをインストールするか、既存のアダプターを使用することで、GoogleFacebookなどの人気のあるOAuthプロバイダーと統合できます。たとえば、Facebook App IDを設定し、Parse.FacebookUtils.logIn()を使用することで、Facebookログインを設定できます。詳細な手順は異なるため、ソーシャルログインドキュメント。

JS


メール確認とパスワードリセット

メール確認とパスワードリセットを有効にするには:

  1. Back4Appダッシュボードのメール設定に移動します。
  2. メール確認を有効にすることで、新しいユーザーが自分のメールアドレスの所有権を確認できるようにします。
  3. 送信元アドレスを設定する, メールテンプレート、および必要に応じてカスタムドメインを設定します。

これらの機能は、ユーザーのメールの所有権を検証し、安全なパスワード回復方法を提供することで、アカウントのセキュリティとユーザーエクスペリエンスを向上させます。

ステップ6 – ファイルストレージの取り扱い

ファイルのアップロードと取得

Parseには、ファイルアップロードを処理するためのParse.Fileクラスが含まれており、Back4Appが安全に保存します:

JS


ファイルURLの取得は簡単です:

JS


この imageUrl をMeteorテンプレートやフロントエンドコンポーネントで、src として設定することで表示できます。<img> タグの。

ファイルセキュリティ

Parse Serverは、ファイルアップロードのセキュリティを管理するための柔軟な設定を提供します。以下の例は、誰がサーバーにファイルをアップロードできるかを制御するための権限を設定する方法を示しています:

{ "fileUpload": { "enableForPublic": true, "enableForAnonymousUser": true, "enableForAuthenticatedUser": true } }

  • enableForPublic: trueに設定すると、認証状態に関係なく、誰でもファイルをアップロードできるようになります。
  • enableForAnonymousUser: 匿名ユーザー(サインアップしていないユーザー)がファイルをアップロードできるかどうかを制御します。
  • enableForAuthenticatedUser: 認証されたユーザーのみがファイルをアップロードできるかどうかを指定します。

ステップ7 – クラウドジョブによるタスクのスケジューリング

クラウドジョブ

クラウドジョブはBack4Appで、バックエンドでの定期的なタスク(古いデータのクリーンアップや毎日のサマリーメールの送信など)をスケジュールして実行できます。典型的なクラウドジョブは次のようになります:

JS

  1. Cloud Codeをデプロイする 新しいジョブで(CLIまたはダッシュボード経由で)。
  2. Back4Appダッシュボードに移動する > アプリ設定 > サーバー設定 > バックグラウンドジョブ.
  3. ジョブをスケジュールする 毎日またはニーズに合った間隔で実行されるように。
クラウドジョブのスケジューリング
クラウドジョブのスケジューリング


クラウドジョブは、手動の介入を必要とせずに、バックグラウンドメンテナンスやその他の定期的なプロセスを自動化することを可能にします。

ステップ8 – Webhookの統合

Webhooks は、特定のイベントが発生するたびに、Back4Appアプリが外部サービスにHTTPリクエストを送信できるようにします。これは、決済ゲートウェイ(例:Stripe)、メールマーケティングツール、または分析プラットフォームなどのサードパーティシステムとの統合に強力です。

  1. Webhooks設定に移動 あなたのBack4Appダッシュボード > その他 > WebHooksに行き、次に「Webhookを追加」をクリックします。
  2. エンドポイントを設定 (例: https://your-external-service.com/webhook-endpoint)。
  3. トリガーを設定 して、Back4AppのクラスやCloud Code関数内のどのイベントがWebhookを発火させるかを指定します。
Webhookの追加
Webhookの追加


例えば、新しいTodoが作成されるたびにSlackチャンネルに通知したい場合:

  • 受信Webhookを受け入れるSlackアプリを作成します。
  • SlackのWebhook URLをコピーします。
  • Back4Appダッシュボードで、「Todoクラスの新しいレコード」というイベントのために、そのSlack URLにエンドポイントを設定します。
  • 必要に応じて、カスタムHTTPヘッダーやペイロードを追加することもできます。

Cloud CodeでWebhooksを定義することもできます。beforeSaveやafterSaveのトリガーでカスタムHTTPリクエストを作成します:

BeforeSave WebHook
BeforeSave WebHook


ステップ9 – Back4App管理パネルの探索

Back4App Admin App」は、非技術的なユーザーがCRUD操作を実行し、コードを書くことなく日常的なデータタスクを処理するために設計されたウェブベースの管理インターフェースです。これは、データベース管理、カスタムデータ管理、エンタープライズレベルの操作を効率化するモデル中心, ユーザーフレンドリーなインターフェースを提供します。

管理アプリの有効化

有効化」は、アプリダッシュボード > その他 > 管理アプリに移動し、「管理アプリを有効化」ボタンをクリックします。

管理アプリを有効化
管理アプリを有効化


最初の管理ユーザーを作成(ユーザー名/パスワード)すると、新しい役割(B4aAdminUser)とクラス(B4aSetting、B4aMenuItem、B4aCustomField)がアプリのスキーマに自動的に生成されます。

Document image


管理インターフェースにアクセスするためのサブドメインを選択し、セットアップを完了します。

Document image


ログイン して、新しい管理アプリのダッシュボードにアクセスするために作成した管理者資格情報を使用してください。

Document image


有効にすると、Back4App管理アプリを使用して、データベースのレコードを簡単に表示、編集、または削除できます。Parseダッシュボードやバックエンドコードを直接使用する必要はありません。設定可能なアクセス制御を使用することで、データを管理するための明確でポイント&クリックの方法が必要なチームメンバーやクライアントとこのインターフェースを安全に共有できます。

結論

この包括的なチュートリアルに従うことで、あなたは:

  • 安全なバックエンドを作成しました Back4App上のMeteorJSアプリ用。
  • データベースを構成しました クラススキーマ、データ型、関係を使用して。
  • リアルタイムクエリを統合しました (ライブクエリ)即時データ更新のため。
  • セキュリティ対策を適用しました ACLとCLPを使用してデータアクセスを保護および管理。
  • クラウドコードを実装しました サーバー側でカスタムビジネスロジックを実行するための関数。
  • ユーザー認証を設定しました メール確認とパスワードリセットをサポート。
  • ファイルのアップロードを管理しました オプションのファイルセキュリティコントロール付き。
  • クラウドジョブをスケジュールしました 自動化されたバックグラウンドタスクのため。
  • Webhookを使用しました 外部サービスとの統合のため。
  • Back4App管理パネルを探索しました データ管理のため。

堅牢なMeteorJSプラットフォームと強力なBack4Appバックエンドを持つことで、機能豊富でスケーラブルかつ安全なアプリケーションを開発するための準備が整いました。より高度な機能を探求し、ビジネスロジックを統合し、Back4Appの力を活用してサーバーとデータベースの管理にかかる無数の時間を節約してください。コーディングを楽しんでください!

次のステップ

  • 本番環境に適したMeteorJSアプリを構築する このバックエンドを拡張して、より複雑なデータモデル、キャッシング戦略、パフォーマンス最適化を処理します。
  • 高度な機能を統合する 専門的な認証フロー、役割ベースのアクセス制御、または外部API(支払いゲートウェイなど)を含みます。
  • Back4Appの公式ドキュメントをチェックする 高度なセキュリティ、パフォーマンス調整、ログ分析についての詳細な情報を得るために。
  • 他のチュートリアルを探る リアルタイムチャットアプリケーション、IoTダッシュボード、または位置情報サービスに関するものです。ここで学んだ技術をサードパーティのAPIと組み合わせて、複雑な実世界のアプリケーションを作成できます。