Azure Cosmos DB の MongoDB 用 API で Angular アプリを作成する - Mongoose を使用して Azure Cosmos DB に接続する

[アーティクル]
08/15/2024

適用対象: MongoDB

複数のパートから成るこのチュートリアルでは、Express と Angular を使用して Node.js アプリを作成し、Azure Cosmos DB の MongoDB 用 API で構成された Azure Cosmos DB アカウントにそれを接続する方法を紹介します。この記事はチュートリアルのパート 5 であり、パート 4 が基になっています。

チュートリアルのこのパートでは、次のことを行います。

Mongoose を使って Azure Cosmos DB に接続します。
Azure Cosmos DB 接続文字列を取得します。
ヒーローモデルを作成します。
ヒーローデータを取得するためのヒーローサービスを作成します。
アプリをローカルで実行します。

Azure サブスクリプションをお持ちでない場合は、開始する前に無料アカウントを作成してください。

前提条件

このチュートリアルを始める前に、パート 4 の手順を完了しておきます。
このチュートリアルでは、Azure CLI をローカルで実行する必要があります。また、Azure CLI バージョン 2.0 以降がインストールされている必要があります。バージョンを確認するには、az --version を実行します。 Azure CLI をインストールまたはアップグレードする必要がある場合は、Azure CLI 2.0 のインストールに関するページを参照してください。
このチュートリアルでは、アプリケーションを作成する手順を段階的に説明します。完成したプロジェクトをダウンロードしたい場合は、GitHub の angular-cosmosdb リポジトリから完全なアプリケーションを取得できます。

Mongoose を使用して接続する

Mongoose は、MongoDB および Node.js のためのオブジェクトデータモデリング (ODM) ライブラリです。 Mongoose を使用して Azure Cosmos DB アカウントに接続できます。 Mongoose をインストールして Azure Cosmos DB に接続するには、以下の手順のようにします。

MongoDB との対話に使用される API である mongoose npm モジュールをインストールします。
```
npm install mongoose@5.13.15 --save
```
重要

Azure Cosmos DB for MongoDB は、バージョン 5.13.15 までの Mongoose と互換性があります。詳細については、Mongoose GitHub リポジトリの問題の説明に関するページを参照してください。
server フォルダーに、mongo.js という名前のファイルを作成します。 Azure Cosmos DB アカウントの接続の詳細を、このファイルに追加します。
次のコードを mongo.js ファイルにコピーします。このコードでは以下の機能が提供されます。
- Mongoose を要求する。
- Mongo の Promise をオーバーライドして ES6/ES2015 以降のバージョンに組み込まれている基本的な Promise を使用する。
- 環境の種類 (ステージング、運用、開発) に応じて特定の動作を設定できる env ファイルを要求する。そのファイルは、次のセクションで作成します。
- MongoDB の接続文字列をインクルードする。その接続文字列は、env ファイルで設定されています。
- Mongoose を呼び出す connect 関数を作成する。
```
const mongoose = require('mongoose');
/**
* Set to Node.js native promises
* Per https://mongoosejs.com/docs/promises.html
*/
mongoose.Promise = global.Promise;

const env = require('./env/environment');

// eslint-disable-next-line max-len
const mongoUri = `mongodb://${env.accountName}:${env.key}@${env.accountName}.documents.azure.com:${env.port}/${env.databaseName}?ssl=true`;

function connect() {
mongoose.set('debug', true);
return mongoose.connect(mongoUri, { useMongoClient: true });
}

module.exports = {
connect,
mongoose
};
```
[エクスプローラー] ウィンドウで、server の下に environment という名前のフォルダーを作成します。 environment フォルダーに、environment.js という名前のファイルを作成します。

mongo.js ファイルから、dbName、key、cosmosPort パラメーターの値を含める必要があります。次のコードを environment.js ファイルにコピーします。

// TODO: replace if yours are different
module.exports = {
  accountName: 'your-cosmosdb-account-name-goes-here',
  databaseName: 'admin', 
  key: 'your-key-goes-here',
  port: 10255
};

接続文字列を取得する

アプリケーションを Azure Cosmos DB に接続するには、アプリケーションの構成設定を更新する必要があります。以下の手順で、設定を更新します。

Azure portal で、Azure Cosmos DB アカウントのポート番号、名前、プライマリキーの値を取得します。
environment.js ファイルで、port の値を 10255 に変更します。
```
const port = 10255;
```
environment.js ファイルで、accountName の値を、チュートリアルのパート 4 で作成した Azure Cosmos DB アカウントの名前に変更します。
ターミナルウィンドウで次の CLI コマンドを使って Azure Cosmos DB アカウントのプライマリキーを取得します。
```
az cosmosdb list-keys --name <cosmosdb-name> -g myResourceGroup
```
<cosmosdb-name> は、チュートリアルのパート 4 で作成した Azure Cosmos DB アカウントの名前です。
プライマリキーを environment.js ファイルの key の値にコピーします。

これで、Azure Cosmos DB に接続するために必要なすべての情報がアプリケーションに設定されます。

ヒーローモデルを作成する

次に、モデルファイルを定義することで、Azure Cosmos DB に格納するデータのスキーマを定義する必要があります。次の手順を使用して、データのスキーマを定義する "ヒーローモデル" を作成します。

[エクスプローラー] ウィンドウで、server フォルダーに hero.model.js という名前のファイルを作成します。
次のコードを hero.model.js ファイルにコピーします。このコードでは以下の機能が提供されます。
- Mongoose を要求する。
- 識別子 (id)、名前 (name)、台詞 (saying) を含んだ新しいスキーマを作成する。
- スキーマを使用してモデルを作成する。
- モデルをエクスポートする。
- コレクションに Heroes という名前を付ける (Mongoose の複数形の名前付け規則に従ったコレクションの既定の名前である Heros ではありません)。
```
const mongoose = require('mongoose');

const Schema = mongoose.Schema;

const heroSchema = new Schema(
  {
    id: { type: Number, required: true, unique: true },
    name: String,
    saying: String
  },
  {
    collection: 'Heroes'
  }
);

const Hero = mongoose.model('Hero', heroSchema);

module.exports = Hero;
```

ヒーローサービスを作成する

ヒーローモデルを作成した後は、データを読み取り、一覧表示、作成、削除、更新の操作を実行するサービスを定義する必要があります。次の手順を使用して、Azure Cosmos DB のデータのクエリを実行する "ヒーローサービス" を作成します。

[エクスプローラー] ウィンドウで、server フォルダーに hero.service.js という名前のファイルを作成します。
次のコードを hero.service.js ファイルにコピーします。このコードでは以下の機能が提供されます。
- 作成したモデルを取得する。
- データベースに接続する。
- hero.find メソッドを使用してすべてのヒーローを返すクエリを定義する docquery 変数を作成する。
- Promise を使用して docquery.exec 関数でクエリを実行し、応答の状態が 200 であるすべてのヒーローのリストを取得する。
- 状態が 500 の場合は、エラーメッセージを返す。
- モジュールを使用しているため、ヒーローを取得する。
```
const Hero = require('./hero.model');

require('./mongo').connect();

function getHeroes() {
  const docquery = Hero.find({});
  docquery
    .exec()
    .then(heroes => {
      res.status(200).json(heroes);
    })
    .catch(error => {
      res.status(500).send(error);
      return;
    });
}

module.exports = {
  getHeroes
};
```

ルートを構成する

次に、取得、作成、読み取り、削除の各要求に対する URL を処理するためのルートを設定する必要があります。ルーティングメソッドでは、コールバック関数を指定します ("ハンドラー関数" とも呼ばれます)。これらの関数は、指定されたエンドポイントと HTTP メソッドに対する要求をアプリケーションが受け取ると呼び出されます。次の手順を使用して、ヒーローサービスを追加し、ルートを定義します。

Visual Studio Code で routes.js ファイルを開き、サンプルヒーローデータを送信する res.send 関数をコメントにします。代わりに、heroService.getHeroes 関数を呼び出す行を追加します。
```
router.get('/heroes', (req, res) => {
  heroService.getHeroes(req, res);
//  res.send(200, [
//      {"id": 10, "name": "Starlord", "saying": "oh yeah"}
//  ])
});
```
routes.js ファイルで、require を使用してヒーローサービスを要求します。
```
const heroService = require('./hero.service'); 
```
hero.service.js ファイルで、getHeroes 関数を次のように更新し、req パラメーターと res パラメーターを受け取るようにします。
```
function getHeroes(req, res) {
```

ここで、前のコードを振り返ってみましょう。最初の index.js ファイルでは、ノードサーバーをセットアップしています。ルートを設定して定義していることに注意してください。次に、routes.js ファイルでは、ヒーローサービスと対話し、関数 (getHeroes など) を取得して要求と応答を渡すよう命令します。 hero.service.js ファイルでは、モデルを取得し、Mongo に接続します。その後、呼び出すと getHeroes が実行されて、200 の応答が返されます。

アプリを実行する

次に、以下の手順を使用してアプリを実行します。

Visual Studio Code ですべての変更を保存します。左側で、[デバッグ] ボタンを選んでから、[デバッグの開始] ボタンを選びます。
ここでブラウザーに切り替えます。 開発者ツールを開き、 [ネットワーク] タブを開きます。http://localhost:3000 に移動すると、このアプリケーションが表示されます。

アプリにはヒーローがまだ格納されていません。このチュートリアルの次のパートでは、プット、プッシュ、削除の機能を追加します。そうすれば、Azure Cosmos DB データベースへの Mongoose 接続を使用して、UI からヒーローを追加、更新、削除することができます。

リソースをクリーンアップする

リソースが必要なくなったら、リソースグループ、Azure Cosmos DB アカウント、およびすべての関連リソースを削除できます。リソースグループを削除するには次のようにします。

Azure Cosmos DB アカウントを作成したリソースグループに移動します。
[リソースグループの削除] を選択します。
削除するリソースグループの名前を確認し、 [削除] を選択します。

次のステップ

続いてチュートリアルのパート 6 に進み、Post、Put、Delete の各関数をアプリに追加します。

パート 6:Post、Put、Delete の各関数をアプリに追加する

Azure Cosmos DB への移行のための容量計画を実行しようとしていますか? 容量計画のために、既存のデータベースクラスターに関する情報を使用できます。

既存のデータベースクラスター内の仮想コアとサーバーの数のみがわかっている場合は、仮想コア数または仮想 CPU 数を使用した要求ユニットの見積もりに関するページを参照してください
現在のデータベースワークロードに対する通常の要求レートがわかっている場合は、Azure Cosmos DB Capacity Planner を使用した要求ユニットの見積もりに関するページを参照してください

次の方法で共有

Azure Cosmos DB の MongoDB 用 API で Angular アプリを作成する - Mongoose を使用して Azure Cosmos DB に接続する

前提条件

Mongoose を使用して接続する

接続文字列を取得する

ヒーローモデルを作成する

ヒーローサービスを作成する

ルートを構成する

アプリを実行する

リソースをクリーンアップする

次のステップ

フィードバック

その他のリソース

次の方法で共有

Azure Cosmos DB の MongoDB 用 API で Angular アプリを作成する - Mongoose を使用して Azure Cosmos DB に接続する

前提条件

Mongoose を使用して接続する

接続文字列を取得する

ヒーロー モデルを作成する

ヒーロー サービスを作成する

ルートを構成する

アプリを実行する

リソースをクリーンアップする

次のステップ

フィードバック

その他のリソース

ヒーローモデルを作成する

ヒーローサービスを作成する