コンテンツにスキップ
Aspire
Docs Try Aspire
Docs Try

Install Aspire CLI

macOS

curl -sSL https://aspire.dev/install.sh | bash

Linux

curl -sSL https://aspire.dev/install.sh | bash

Windows

irm https://aspire.dev/install.ps1 | iex
More installation options

AppHost とは？

Aspire の AppHost は、アプリケーションのサービスとその関係をコードファーストで宣言する場所です。散在した設定ファイルを管理する代わりに、アーキテクチャをコードで記述します。ローカルでのオーケストレーションは Aspire が処理するため、機能開発に集中できます。

API プラットフォームを選択

TypeScript で AppHost を書きたい場合は、最初の Aspire アプリを作成するから始めてください。

アーキテクチャの定義

Section titled “アーキテクチャの定義”

フロントエンドが API と通信し、API がデータベースと通信する、シンプルな 3 層アーキテクチャを考えてみましょう。

architecture-beta

  service db(logos:postgresql)[PostgreSQL]
  service api(logos:dotnet)[API service]
  service frontend(logos:react)[React frontend]

  api:R --> L:db
  frontend:R --> L:api

このアーキテクチャは、.NET API が PostgreSQL データベース に接続し、React フロントエンド がその API を利用する構成を示しています。.NET API は ASP.NET Core を使用し、Entity Framework または接続文字列を用いて PostgreSQL に接続します。React フロントエンドは Vite で構築され、HTTP 経由で API と通信します。

このアーキテクチャを手順どおりに構築するには、クイックスタートの 最初の Aspire アプリを作成するを参照してください。

architecture-beta

  service db(logos:postgresql)[PostgreSQL]
  service api(logos:python)[API service]
  service frontend(logos:react)[React frontend]

  api:R --> L:db
  frontend:R --> L:api

このアーキテクチャは、Python API（FastAPI/Uvicorn を使用） が PostgreSQL データベース に接続し、React フロントエンド がその API を利用する構成を示しています。Python API は FastAPI や Flask などのフレームワークを使用し、psycopg2 や SQLAlchemy などのライブラリを用いて PostgreSQL に接続します。React フロントエンドは Vite で構築され、HTTP 経由で API と通信します。

既存の Python ベース アプリにこのアーキテクチャを追加するには、既存のアプリに Aspire を追加する から始めて、次に Python との統合 を確認してください。

architecture-beta

  service db(logos:postgresql)[PostgreSQL]
  service api(logos:nodejs-icon)[API service]
  service frontend(logos:react)[React frontend]

  api:R --> L:db
  frontend:R --> L:api

このアーキテクチャは、Node.js API が PostgreSQL データベースに接続し、React フロントエンド がその API を利用する構成を示しています。Node.js API は Express や Fastify などのフレームワークを使用し、pg や Prisma などのライブラリを用いて PostgreSQL に接続します。React フロントエンドは Vite で構築され、HTTP 経由で API と通信します。

architecture-beta

  service db(logos:postgresql)[PostgreSQL]
  service api(logos:go)[API service]
  service frontend(logos:react)[React frontend]

  api:R --> L:db
  frontend:R --> L:api

このアーキテクチャは、Go API が PostgreSQL データベースに接続し、React フロントエンドがその API を利用する構成を示しています。Go API は標準ライブラリの net/http パッケージ、または Gin や Echo などのフレームワークを使用し、pgx や database/sql などのライブラリを用いて PostgreSQL に接続します。React フロントエンドは Vite で構築され、HTTP 経由で API と通信します。

architecture-beta

  service db(logos:postgresql)[PostgreSQL]
  service api(logos:java)[API service]
  service frontend(logos:react)[React frontend]

  api:R --> L:db
  frontend:R --> L:api

このアーキテクチャは、Java API（Spring Boot を使用）が PostgreSQL データベースに接続し、React フロントエンド がその API を利用する構成を示しています。Java API は Spring Boot と Spring Data JPA を使用し、JDBC または Spring Data を用いて PostgreSQL に接続します。React フロントエンドは Vite で構築され、HTTP 経由で API と通信します。

このアーキテクチャは、AppHost では次のように表現できます。

AppHost.cs
var builder = DistributedApplication.CreateBuilder(args);


// Add database resource
var postgres = builder.AddPostgres("db")
    .AddDatabase("appdata")
    .WithDataVolume();


// Add API service and reference the database
var api = builder.AddProject<Projects.Api>("api")
    .WithReference(postgres)
    .WaitFor(postgres);


// Add frontend service and reference the API
builder.AddViteApp("frontend", "../frontend")
    .WithHttpEndpoint(env: "PORT")
    .WithReference(api);


builder.Build().Run();

AddProject<Projects.Api>() を使って .NET プロジェクトを参照します。
AppHost.cs
var builder = DistributedApplication.CreateBuilder(args);


// Add database resource
var postgres = builder.AddPostgres("db")
    .AddDatabase("appdata")
    .WithDataVolume();


// Add API service and reference the database
var api = builder.AddUvicornApp("api", "../api", "main:app")
    .WithUv()
    .WithReference(postgres)
    .WaitFor(postgres);


// Add frontend service and reference the API
builder.AddViteApp("frontend", "../frontend")
    .WithHttpEndpoint(env: "PORT")
    .WithReference(api);


builder.Build().Run();

FastAPI のような ASGI アプリには、AddUvicornApp() と WithUv() を使います。
AppHost.cs
var builder = DistributedApplication.CreateBuilder(args);


// Add database resource
var postgres = builder.AddPostgres("db")
    .AddDatabase("appdata")
    .WithDataVolume();


// Add API service and reference the database
var api = builder.AddNodeApp("api", "../api", "server.js")
    .WithNpm()
    .WithReference(postgres)
    .WaitFor(postgres);


// Add frontend service and reference the API
builder.AddViteApp("frontend", "../frontend")
    .WithHttpEndpoint(env: "PORT")
    .WithReference(api);


builder.Build().Run();

Node.js アプリケーションには、AddNodeApp() と WithNpm() を使います。
AppHost.cs
var builder = DistributedApplication.CreateBuilder(args);


// Add database resource
var postgres = builder.AddPostgres("db")
    .AddDatabase("appdata")
    .WithDataVolume();


// Add API service and reference the database
var api = builder.AddGolangApp("api", "../api")
    .WithHttpEndpoint(env: "PORT")
    .WithReference(postgres)
    .WaitFor(postgres);


// Add frontend service and reference the API
builder.AddViteApp("frontend", "../frontend")
    .WithHttpEndpoint(env: "PORT")
    .WithReference(api);


builder.Build().Run();

Go アプリケーションには AddGolangApp() を使います。

AppHost.cs
var builder = DistributedApplication.CreateBuilder(args);


// Add database resource
var postgres = builder.AddPostgres("db")
    .AddDatabase("appdata")
    .WithDataVolume();


// Add API service and reference the database
var api = builder.AddSpringApp("api", "../api", "otel.jar")
    .WithHttpEndpoint(port: 8080)
    .WithReference(postgres)
    .WaitFor(postgres);


// Add frontend service and reference the API
builder.AddViteApp("frontend", "../frontend")
    .WithHttpEndpoint(env: "PORT")
    .WithReference(api);


builder.Build().Run();

Spring Boot アプリケーションには AddSpringApp() を使います。

AppHost は、分散アプリケーションを宣言的にモデル化します。上の各コード サンプルは、PostgreSQL データベース、API サービス、React フロントエンド から成る同じ 3 層アーキテクチャを示していますが、API の実装と、利用できる場合は AppHost の言語が異なります。

どの場合でも、PostgreSQL データベースと React フロントエンドは同じです。Aspire のリソース参照がリソース間の依存関係を表現し、アプリ モデルがサービスを正しい順序で起動させます。

Aspire は、使用する言語やフレームワークに関係なく、サービス、リソース、接続関係という同じ一貫したモデルを提供します。

AppHost コードの分解

Section titled “AppHost コードの分解”

ここでは、典型的な AppHost の主要な部分を取り上げて、各ステップが何をしているのかを説明します。

AppHost.cs
var builder = DistributedApplication.CreateBuilder(args);


14 collapsed lines
// Add database resource
var postgres = builder.AddPostgres("db")
    .AddDatabase("appdata")
    .WithDataVolume();


// Add API service and reference the database
var api = builder.AddProject<Projects.Api>("api")
    .WithReference(postgres)
    .WaitFor(postgres);


// Add frontend service and reference the API
builder.AddViteApp("frontend", "../frontend")
    .WithHttpEndpoint(env: "PORT")
    .WithReference(api);


builder.Build().Run();

展開されている行で行っていること:

  • DistributedApplication.CreateBuilder(args) を使って分散アプリケーション ビルダーを作成します。
  • Build() を呼び出して、構成を実行可能な AppHost として具体化します。
  • Run() を呼び出してオーケストレーションを開始し、サービスは依存関係の順序に従って起動します。
AppHost.cs
var builder = DistributedApplication.CreateBuilder(args);


15 collapsed lines
// Add database resource
var postgres = builder.AddPostgres("db")
    .AddDatabase("appdata")
    .WithDataVolume();


// Add API service and reference the database
var api = builder.AddUvicornApp("api", "../api", "main:app")
    .WithUv()
    .WithReference(postgres)
    .WaitFor(postgres);


// Add frontend service and reference the API
builder.AddViteApp("frontend", "../frontend")
    .WithHttpEndpoint(env: "PORT")
    .WithReference(api);


builder.Build().Run();

展開されている行で行っていること:

  • DistributedApplication.CreateBuilder(args) を使って分散アプリケーション ビルダーを作成します。
  • Build() を呼び出して、構成を実行可能な AppHost として具体化します。
  • Run() を呼び出してオーケストレーションを開始し、サービスは依存関係の順序に従って起動します。
AppHost.cs
var builder = DistributedApplication.CreateBuilder(args);


15 collapsed lines
// Add database resource
var postgres = builder.AddPostgres("db")
    .AddDatabase("appdata")
    .WithDataVolume();


// Add API service and reference the database
var api = builder.AddNodeApp("api", "../api", "server.js")
    .WithNpm()
    .WithReference(postgres)
    .WaitFor(postgres);


// Add frontend service and reference the API
builder.AddViteApp("frontend", "../frontend")
    .WithHttpEndpoint(env: "PORT")
    .WithReference(api);


builder.Build().Run();

展開されている行で行っていること:

  • DistributedApplication.CreateBuilder(args) を使って分散アプリケーション ビルダーを作成します。
  • Build() を呼び出して、構成を実行可能な AppHost として具体化します。
  • Run() を呼び出してオーケストレーションを開始し、サービスは依存関係の順序に従って起動します。
AppHost.cs
var builder = DistributedApplication.CreateBuilder(args);


15 collapsed lines
// Add database resource
var postgres = builder.AddPostgres("db")
    .AddDatabase("appdata")
    .WithDataVolume();


// Add API service and reference the database
var api = builder.AddGolangApp("api", "../api")
    .WithHttpEndpoint(env: "PORT")
    .WithReference(postgres)
    .WaitFor(postgres);


// Add frontend service and reference the API
builder.AddViteApp("frontend", "../frontend")
    .WithHttpEndpoint(env: "PORT")
    .WithReference(api);


builder.Build().Run();

展開されている行で行っていること:

  • DistributedApplication.CreateBuilder(args) を使って分散アプリケーション ビルダーを作成します。
  • Build() を呼び出して、構成を実行可能な AppHost として具体化します。
  • Run() を呼び出してオーケストレーションを開始し、サービスは依存関係の順序に従って起動します。
AppHost.cs
var builder = DistributedApplication.CreateBuilder(args);


15 collapsed lines
// Add database resource
var postgres = builder.AddPostgres("db")
    .AddDatabase("appdata")
    .WithDataVolume();


// Add API service and reference the database
var api = builder.AddSpringApp("api", "../api", "otel.jar")
    .WithHttpEndpoint(port: 8080)
    .WithReference(postgres)
    .WaitFor(postgres);


// Add frontend service and reference the API
builder.AddViteApp("frontend", "../frontend")
    .WithHttpEndpoint(env: "PORT")
    .WithReference(api);


builder.Build().Run();

展開されている行で行っていること:

  • DistributedApplication.CreateBuilder(args) を使って分散アプリケーション ビルダーを作成します。
  • Build() を呼び出して、構成を実行可能な AppHost として具体化します。
  • Run() を呼び出してオーケストレーションを開始し、サービスは依存関係の順序に従って起動します。

AppHost は分散アプリケーションの設計図であり、残りの処理は Aspire が管理します。

PostgreSQL リソースの追加

Section titled “PostgreSQL リソースの追加”

ビルダーの準備ができたら、リソースとサービスを定義します。次のスニペットは、PostgreSQL サーバーとデータベースを追加する方法を示しています。

AppHost.cs
var builder = DistributedApplication.CreateBuilder(args);


// Add database resource
var postgres = builder.AddPostgres("db")
    .AddDatabase("appdata")
    .WithDataVolume();


10 collapsed lines
// Add API service and reference the database
var api = builder.AddProject<Projects.Api>("api")
    .WithReference(postgres)
    .WaitFor(postgres);


// Add frontend service and reference the API
builder.AddViteApp("frontend", "../frontend")
    .WithHttpEndpoint(env: "PORT")
    .WithReference(api);


builder.Build().Run();

仕組み:

  • AddPostgres(“db”) は、db という名前の PostgreSQL コンテナーを登録します。
  • .AddDatabase(“appdata”) は、そのサーバー上に appdata という名前のデータベースを作成します。
  • .WithDataVolume() は、コンテナーの再起動後もデータが保持されるようにボリュームを用意します。
AppHost.cs
var builder = DistributedApplication.CreateBuilder(args);


// Add database resource
var postgres = builder.AddPostgres("db")
    .AddDatabase("appdata")
    .WithDataVolume();


11 collapsed lines
// Add API service and reference the database
var api = builder.AddUvicornApp("api", "../api", "main:app")
    .WithUv()
    .WithReference(postgres)
    .WaitFor(postgres);


// Add frontend service and reference the API
builder.AddViteApp("frontend", "../frontend")
    .WithHttpEndpoint(env: "PORT")
    .WithReference(api);


builder.Build().Run();

仕組み:

  • AddPostgres(“db”) は、db という名前の PostgreSQL コンテナーを登録します。
  • .AddDatabase(“appdata”) は、そのサーバー上に appdata という名前のデータベースを作成します。
  • .WithDataVolume() は、コンテナーの再起動後もデータが保持されるようにボリュームを用意します。
AppHost.cs
var builder = DistributedApplication.CreateBuilder(args);


// Add database resource
var postgres = builder.AddPostgres("db")
    .AddDatabase("appdata")
    .WithDataVolume();


11 collapsed lines
// Add API service and reference the database
var api = builder.AddNodeApp("api", "../api", "server.js")
    .WithNpm()
    .WithReference(postgres)
    .WaitFor(postgres);


// Add frontend service and reference the API
builder.AddViteApp("frontend", "../frontend")
    .WithHttpEndpoint(env: "PORT")
    .WithReference(api);


builder.Build().Run();

仕組み:

  • AddPostgres(“db”) は、db という名前の PostgreSQL コンテナーを登録します。
  • .AddDatabase(“appdata”) は、そのサーバー上に appdata という名前のデータベースを作成します。
  • .WithDataVolume() は、コンテナーの再起動後もデータが保持されるようにボリュームを用意します。
AppHost.cs
var builder = DistributedApplication.CreateBuilder(args);


// Add database resource
var postgres = builder.AddPostgres("db")
    .AddDatabase("appdata")
    .WithDataVolume();


11 collapsed lines
// Add API service and reference the database
var api = builder.AddGolangApp("api", "../api")
    .WithHttpEndpoint(env: "PORT")
    .WithReference(postgres)
    .WaitFor(postgres);


// Add frontend service and reference the API
builder.AddViteApp("frontend", "../frontend")
    .WithHttpEndpoint(env: "PORT")
    .WithReference(api);


builder.Build().Run();

仕組み:

  • AddPostgres(“db”) は、db という名前の PostgreSQL コンテナーを登録します。
  • .AddDatabase(“appdata”) は、そのサーバー上に appdata という名前のデータベースを作成します。
  • .WithDataVolume() は、コンテナーの再起動後もデータが保持されるようにボリュームを用意します。
AppHost.cs
var builder = DistributedApplication.CreateBuilder(args);


// Add database resource
var postgres = builder.AddPostgres("db")
    .AddDatabase("appdata")
    .WithDataVolume();


11 collapsed lines
// Add API service and reference the database
var api = builder.AddSpringApp("api", "../api", "otel.jar")
    .WithHttpEndpoint(port: 8080)
    .WithReference(postgres)
    .WaitFor(postgres);


// Add frontend service and reference the API
builder.AddViteApp("frontend", "../frontend")
    .WithHttpEndpoint(env: "PORT")
    .WithReference(api);


builder.Build().Run();

仕組み:

  • AddPostgres(“db”) は、db という名前の PostgreSQL コンテナーを登録します。
  • .AddDatabase(“appdata”) は、そのサーバー上に appdata という名前のデータベースを作成します。
  • .WithDataVolume() は、コンテナーの再起動後もデータが保持されるようにボリュームを用意します。

公式の PostgreSQL integration を参照してください。

API リソースの追加と依存関係の宣言

Section titled “API リソースの追加と依存関係の宣言”

次に、API サービスを登録し、PostgreSQL リソースに接続します。

AppHost.cs
6 collapsed lines
var builder = DistributedApplication.CreateBuilder(args);


// Add database resource
var postgres = builder.AddPostgres("db")
    .AddDatabase("appdata")
    .WithDataVolume();


// Add API service and reference the database
var api = builder.AddProject<Projects.Api>("api")
    .WithReference(postgres)
    .WaitFor(postgres);


5 collapsed lines
// Add frontend service and reference the API
builder.AddViteApp("frontend", "../frontend")
    .WithHttpEndpoint(env: "PORT")
    .WithReference(api);


builder.Build().Run();

行っていること:

  • AddProject<Projects.Api>(“api”) は、API プロジェクトを api という名前のサービスとして登録します。
  • WithReference(postgres) は、接続情報を API の構成に注入します。
  • WaitFor(postgres) は、PostgreSQL が正常になるまで起動を待機します。
AppHost.cs
6 collapsed lines
var builder = DistributedApplication.CreateBuilder(args);


// Add database resource
var postgres = builder.AddPostgres("db")
    .AddDatabase("appdata")
    .WithDataVolume();


// Add API service and reference the database
var api = builder.AddUvicornApp("api", "../api", "main:app")
    .WithUv()
    .WithReference(postgres)
    .WaitFor(postgres);


5 collapsed lines
// Add frontend service and reference the API
builder.AddViteApp("frontend", "../frontend")
    .WithHttpEndpoint(env: "PORT")
    .WithReference(api);


builder.Build().Run();

行っていること:

  • AddUvicornApp(“api”, ”../api”, “main:app”) は、Uvicorn ベースの Python アプリを api という名前のサービスとして登録します。
  • WithUv() は、アプリが uv パッケージ マネージャーを使うように構成します。
  • WithReference(postgres) は、接続情報を API の構成に注入します。
  • WaitFor(postgres) は、PostgreSQL が正常になるまで起動を待機します。
AppHost.cs
6 collapsed lines
var builder = DistributedApplication.CreateBuilder(args);


// Add database resource
var postgres = builder.AddPostgres("db")
    .AddDatabase("appdata")
    .WithDataVolume();


// Add API service and reference the database
var api = builder.AddNodeApp("api", "../api", "server.js")
    .WithNpm()
    .WithReference(postgres)
    .WaitFor(postgres);


5 collapsed lines
// Add frontend service and reference the API
builder.AddViteApp("frontend", "../frontend")
    .WithHttpEndpoint(env: "PORT")
    .WithReference(api);


builder.Build().Run();

行っていること:

  • AddNodeApp(“api”, ”../api”, “server.js”) は、Node.js アプリを api という名前のサービスとして登録します。
  • WithNpm() は、依存関係のインストールに npm を使うように構成します。
  • WithReference(postgres) は、接続情報を API の構成に注入します。
  • WaitFor(postgres) は、PostgreSQL が正常になるまで起動を待機します。
AppHost.cs
6 collapsed lines
var builder = DistributedApplication.CreateBuilder(args);


// Add database resource
var postgres = builder.AddPostgres("db")
    .AddDatabase("appdata")
    .WithDataVolume();


// Add API service and reference the database
var api = builder.AddGolangApp("api", "../api")
    .WithHttpEndpoint(env: "PORT")
    .WithReference(postgres)
    .WaitFor(postgres);


5 collapsed lines
// Add frontend service and reference the API
builder.AddViteApp("frontend", "../frontend")
    .WithHttpEndpoint(env: "PORT")
    .WithReference(api);


builder.Build().Run();

行っていること:

  • AddGolangApp(“api”, ”../api”) は、Go アプリを api という名前のサービスとして登録します。
  • WithHttpEndpoint(env: “PORT”) は、ポートを構成し、PORT 環境変数を設定します。
  • WithReference(postgres) は、接続情報を API の構成に注入します。
  • WaitFor(postgres) は、API の起動を PostgreSQL が正常になるまで待機させます。
AppHost.cs
6 collapsed lines
var builder = DistributedApplication.CreateBuilder(args);


// Add database resource
var postgres = builder.AddPostgres("db")
    .AddDatabase("appdata")
    .WithDataVolume();


// Add API service and reference the database
var api = builder.AddSpringApp("api", "../api", "otel.jar")
    .WithHttpEndpoint(port: 8080)
    .WithReference(postgres)
    .WaitFor(postgres);


5 collapsed lines
// Add frontend service and reference the API
builder.AddViteApp("frontend", "../frontend")
    .WithHttpEndpoint(env: "PORT")
    .WithReference(api);


builder.Build().Run();

行っていること:

  • AddSpringApp(“api”, ”../api”, “otel.jar”) は、Spring Boot アプリを api という名前のサービスとして登録します。
  • WithHttpEndpoint(port: 8080) は、Spring Boot アプリをポート 8080 で公開します。
  • WithReference(postgres) は、接続情報を API の構成に注入します。
  • WaitFor(postgres) は、API の起動を PostgreSQL が正常になるまで待機させます。

これで api サービスが定義できたので、次はフロントエンドを接続できます。

フロントエンド リソースの追加

Section titled “フロントエンド リソースの追加”

フロントエンド プロジェクトを登録し、API への依存関係を宣言すると、AppHost が API のアドレスを自動的に提供します。

AppHost.cs
11 collapsed lines
var builder = DistributedApplication.CreateBuilder(args);


// Add database resource
var postgres = builder.AddPostgres("db")
    .AddDatabase("appdata")
    .WithDataVolume();


// Add API service and reference the database
var api = builder.AddProject<Projects.Api>("api")
    .WithReference(postgres)
    .WaitFor(postgres);


// Add frontend service and reference the API
builder.AddViteApp("frontend", "../frontend")
    .WithHttpEndpoint(env: "PORT")
    .WithReference(api);


builder.Build().Run();

要点:

  • AddViteApp(“frontend”, ”../frontend”) は、フロントエンドを frontend という名前のサービスとして登録します。
  • WithHttpEndpoint(env: “PORT”) は、アプリを公開し、PORT 環境変数でリスナーを制御できるようにします。
  • WithReference(api) は、API のベース アドレスをフロントエンドの構成に注入します。
AppHost.cs
12 collapsed lines
var builder = DistributedApplication.CreateBuilder(args);


// Add database resource
var postgres = builder.AddPostgres("db")
    .AddDatabase("appdata")
    .WithDataVolume();


// Add API service and reference the database
var api = builder.AddUvicornApp("api", "../api", "main:app")
    .WithUv()
    .WithReference(postgres)
    .WaitFor(postgres);


// Add frontend service and reference the API
builder.AddViteApp("frontend", "../frontend")
    .WithHttpEndpoint(env: "PORT")
    .WithReference(api);


builder.Build().Run();

要点:

  • AddViteApp(“frontend”, ”../frontend”) は、フロントエンドを frontend という名前のサービスとして登録します。
  • WithHttpEndpoint(env: “PORT”) は、アプリを公開し、PORT 環境変数でリスナーを制御できるようにします。
  • WithReference(api) は、API のベース アドレスをフロントエンドの構成に注入します。
AppHost.cs
12 collapsed lines
var builder = DistributedApplication.CreateBuilder(args);


// Add database resource
var postgres = builder.AddPostgres("db")
    .AddDatabase("appdata")
    .WithDataVolume();


// Add API service and reference the database
var api = builder.AddNodeApp("api", "../api", "server.js")
    .WithNpm()
    .WithReference(postgres)
    .WaitFor(postgres);


// Add frontend service and reference the API
builder.AddViteApp("frontend", "../frontend")
    .WithHttpEndpoint(env: "PORT")
    .WithReference(api);


builder.Build().Run();

要点:

  • AddViteApp(“frontend”, ”../frontend”) は、フロントエンドを frontend という名前のサービスとして登録します。
  • WithHttpEndpoint(env: “PORT”) は、アプリを公開し、PORT 環境変数でリスナーを制御できるようにします。
  • WithReference(api) は、API のベース アドレスをフロントエンドの構成に注入します。
AppHost.cs
12 collapsed lines
var builder = DistributedApplication.CreateBuilder(args);


// Add database resource
var postgres = builder.AddPostgres("db")
    .AddDatabase("appdata")
    .WithDataVolume();


// Add API service and reference the database
var api = builder.AddGolangApp("api", "../api")
    .WithHttpEndpoint(env: "PORT")
    .WithReference(postgres)
    .WaitFor(postgres);


// Add frontend service and reference the API
builder.AddViteApp("frontend", "../frontend")
    .WithHttpEndpoint(env: "PORT")
    .WithReference(api);


builder.Build().Run();

要点:

  • AddViteApp(“frontend”, ”../frontend”) は、フロントエンドを frontend という名前のサービスとして登録します。
  • WithHttpEndpoint(env: “PORT”) は、アプリを公開し、PORT 環境変数でリスナーを制御できるようにします。
  • WithReference(api) は、API のベース アドレスをフロントエンドの構成に注入します。
AppHost.cs
12 collapsed lines
var builder = DistributedApplication.CreateBuilder(args);


// Add database resource
var postgres = builder.AddPostgres("db")
    .AddDatabase("appdata")
    .WithDataVolume();


// Add API service and reference the database
var api = builder.AddSpringApp("api", "../api", "otel.jar")
    .WithHttpEndpoint(port: 8080)
    .WithReference(postgres)
    .WaitFor(postgres);


// Add frontend service and reference the API
builder.AddViteApp("frontend", "../frontend")
    .WithHttpEndpoint(env: "PORT")
    .WithReference(api);


builder.Build().Run();

要点:

  • AddViteApp(“frontend”, ”../frontend”) は、フロントエンドを frontend という名前のサービスとして登録します。
  • WithHttpEndpoint(env: “PORT”) は、アプリを公開し、PORT 環境変数でリスナーを制御できるようにします。
  • WithReference(api) は、API のベース アドレスをフロントエンドの構成に注入します。

要するに、バックエンドを先に定義し（DB → API）、その後 UI から API を参照します。AppHost は依存関係グラフ、接続の流れ、起動順序を表現します。

構成とネットワーク

Section titled “構成とネットワーク”

これらの依存関係や接続は、Aspire によって自動的に管理されます。AppHost は接続文字列やエンドポイントのような構成値を生成し、必要に応じて各サービスに注入します。AppHost でリソースを追加するときは、db、api、frontend のように名前を付けます。Aspire はそれらの名前を DNS 解決に利用するため、サービス同士は予測可能なアドレスで通信できます。利用側のサービスは、それらの名前を基に構成情報の注入も受け取ります。

architecture-beta

  service db(logos:postgresql)[pg]
  service epr(iconoir:server-connection)[Endpoint Reference]
  service api(logos:dotnet)[api]
  service ctr(iconoir:server-connection)[Connection String Reference]
  service frontend(logos:react)[frontend]

  db:L <-- R:ctr
  ctr:L <-- R:api
  api:L <-- R:epr
  epr:L <-- R:frontend

.NET API は PostgreSQL から ConnectionStringReference を受け取り、React フロントエンドが利用する EndpointReference を公開します。これにより、PostgreSQL → .NET API → React フロントエンド という明確な依存関係チェーンが構築されます。

architecture-beta

  service db(logos:postgresql)[pg]
  service epr(iconoir:server-connection)[Endpoint Reference]
  service api(logos:python)[api]
  service ctr(iconoir:server-connection)[Connection String Reference]
  service frontend(logos:react)[frontend]

  db:L <-- R:ctr
  ctr:L <-- R:api
  api:L <-- R:epr
  epr:L <-- R:frontend

Python API は PostgreSQL から ConnectionStringReference を受け取り、React フロントエンドが利用する EndpointReference を公開します。これにより、PostgreSQL → Python API → React フロントエンド という明確な依存関係チェーンが構築されます。

architecture-beta

  service db(logos:postgresql)[pg]
  service epr(iconoir:server-connection)[Endpoint Reference]
  service api(logos:nodejs-icon)[api]
  service ctr(iconoir:server-connection)[Connection String Reference]
  service frontend(logos:react)[frontend]

  db:L <-- R:ctr
  ctr:L <-- R:api
  api:L <-- R:epr
  epr:L <-- R:frontend

Node.js API は PostgreSQL から ConnectionStringReference を受け取り、React フロントエンドが利用する EndpointReference を公開します。これにより、PostgreSQL → Node.js API → React フロントエンド という明確な依存関係チェーンが構築されます。

architecture-beta

  service db(logos:postgresql)[pg]
  service epr(iconoir:server-connection)[Endpoint Reference]
  service api(logos:go)[api]
  service ctr(iconoir:server-connection)[Connection String Reference]
  service frontend(logos:react)[frontend]

  db:L <-- R:ctr
  ctr:L <-- R:api
  api:L <-- R:epr
  epr:L <-- R:frontend

Go API は PostgreSQL から ConnectionStringReference を受け取り、React フロントエンドが利用する EndpointReference を公開します。これにより、PostgreSQL → Go API → React フロントエンド という明確な依存関係チェーンが構築されます。

architecture-beta

  service db(logos:postgresql)[pg]
  service epr(iconoir:server-connection)[Endpoint Reference]
  service api(logos:java)[api]
  service ctr(iconoir:server-connection)[Connection String Reference]
  service frontend(logos:react)[frontend]

  db:L <-- R:ctr
  ctr:L <-- R:api
  api:L <-- R:epr
  epr:L <-- R:frontend

Java API は PostgreSQL から ConnectionStringReference を受け取り、React フロントエンドが利用する EndpointReference を公開します。これにより、PostgreSQL → Java API → React フロントエンド という明確な依存関係チェーンが構築されます。

これらのリソースがどのように通信するか

  1. pg は ConnectionStringReference を公開します。これはホスト、ポート、データベース、ユーザー、パスワードをまとめた、Aspire が理解できる強く型付けされた情報です。
  2. api はその参照への依存関係を宣言し、Aspire はローカル実行時とデプロイ時の両方で、シークレット、パラメーター、接続文字列を含む設定値を注入します。
  3. api は HTTP エンドポイントが割り当てられた後、自身のベース URL を表す EndpointReference を公開します。
  4. frontend はそのエンドポイントに依存し、Aspire が API のベース URL を注入するため、アドレスをハードコードする必要がありません。

AppHost の仕組み

Section titled “AppHost の仕組み”

AppHost を実行すると、Aspire は次の中核的な役割を担います。

  1. サービス検出: AppHost に宣言されたサービスとリソースを検出します。
  2. 依存関係の解決: 宣言された依存関係に基づいて、サービスを正しい順序で起動します。
  3. 構成情報の注入: 接続文字列、エンドポイント、その他の構成値を自動的に注入します。
  4. 状態監視: サービスの状態を監視し、必要に応じて再起動できます。

Aspire のオーケストレーションや リソースモデル を詳しく確認してください。

AppHost の構成

Section titled “AppHost の構成”

テンプレートの AppHost は、次のような構成になります。

  • ディレクトリAspireApp.AppHost
    • apphost.cs 開発時オーケストレーター
    • apphost.run.json

AppHost のライフサイクル イベント

Section titled “AppHost のライフサイクル イベント”

ライフサイクル イベントにフックすることで、起動時やリソース割り当て時にカスタム ロジックを実行できます。

  1. BeforeStartEvent: AppHost がサービス起動を開始する前に発生します。
  2. AfterEndpointsAllocatedEvent: サービスのエンドポイントが割り当てられた後に発生します。
  3. AfterResourcesCreatedEvent: すべてのリソースが作成された後に発生します。

より細かなライフサイクル制御については、既知のライフサイクル イベントをご覧ください。

ベスト プラクティス

Section titled “ベスト プラクティス”
  • まずは AppHost をシンプルに保ち、必要になったときにだけ複雑さを追加します。
  • .WithReference(...) を使って依存関係を明示的に定義し、接続をわかりやすくします。
  • 開発、テスト、本番で構成を分けて管理します。
  • デバッグやログ確認をしやすくするために、リソースには明確で説明的な名前を付けます。
Connect with us

コミュニティ

SHA — acb4c34 © Microsoft