Azure でワークロードをホストする方法

この記事では、フロントエンドのみのアーキテクチャを使用して、Azure で Fabric Extensibility Toolkit ワークロードをホストする方法について説明します。 Extensibility Toolkit では、静的 Web アプリケーション用に最適化された Azure サービスを使用して、クラウドネイティブのデプロイアプローチを使用します。

アーキテクチャの概要

Fabric Extensibility Toolkit では、Azure サービスを使用したフロントエンドデプロイに重点を置いたアーキテクチャを使用します。

拡張性ツールキットのアーキテクチャ

Extensibility Toolkit アーキテクチャには、次の特性があります。

フロントエンドのみのデプロイ: ワークロードは、別のバックエンドなしでブラウザーで完全に実行されます
静的 Web サイトホスティング: ホスティングに Azure Storage 静的 Web サイトを使用します
Azure Front Door: グローバル CDN、SSL 終了、ルーティングを提供します
マネージドサービス: セキュリティのために Entra ID、Key Vault、およびマネージド ID を活用します
単一のデプロイプロセス: 提供された PowerShell スクリプトをデプロイに使用します

使われている Azure サービス

Azure Front Door

Azure Front Door は、ワークロードのグローバルエントリポイントとして機能します。次の機能を提供します。

グローバル負荷分散: 最も近いエッジの場所にユーザーをルーティングします
SSL 終了: HTTPS 証明書を自動的に処理する
Web アプリケーションファイアウォール (WAF): 一般的な Web 脆弱性から保護します
キャッシュ: エッジの場所で静的資産をキャッシュすることでパフォーマンスを向上させる

Extensibility Toolkit の場合、Front Door は Azure Storage でホストされている静的 Web サイトにトラフィックをルーティングし、世界中で高可用性と低待機時間を確保します。

Azure ストレージアカウント (静的 Web サイト)

静的 Web サイトをホストする Azure Storage アカウントは、ビルドされたワークロードアプリケーションをホストします。これにより、次のような機能が提供されます。

コスト効率の高いホスティング: 使用されるストレージと帯域幅に対してのみ支払う
自動スケーリング: 構成なしでトラフィックの急増を処理する
グローバルな可用性: コンテンツは Azure のグローバルストレージインフラストラクチャから提供されます
ファイルベースのデプロイ: バージョンをデプロイするファイルをアップロードする

Extensibility Toolkit は、ストレージアカウントに直接デプロイされる静的 HTML、JavaScript、CSS、アセットに React アプリケーションをビルドします。

Azure Key Vault

Azure Key Vault では、機密性の高い構成とシークレットが管理されます。

クライアントシークレット: Entra ID アプリケーションシークレットを安全に格納します
API キー: 外部サービス API キーを管理します
構成: 環境固有の設定を格納します
証明書: 必要に応じて SSL 証明書を管理します

ワークロードは、セキュリティで保護された資格情報のない認証のために、マネージド ID を介して Key Vault にアクセスします。

Azure Entra ID (Azure Active Directory)

Azure Entra ID では、認証と承認が提供されます。

アプリの登録: ワークロードを Entra アプリケーションとして登録します
OAuth 2.0 フロー: Fabric でユーザー認証を処理する
API のアクセス許可: Fabric API と Microsoft Graph API へのアクセスを管理します
トークン管理: API 呼び出し用のセキュリティで保護されたアクセストークンを提供します

マネージド ID

マネージド ID は、セキュリティで保護されたサービス間認証を提供します。

資格情報管理なし: コードにシークレットを格納する必要がなくなります
トークン処理: Azure はトークンの取得と更新を処理します
セキュリティで保護されたアクセス: Key Vault やその他の Azure サービスに安全に接続する
ID ライフサイクル: クリーンアップのために Azure リソースに関連付ける

デプロイプロセス

[前提条件]

Azure にデプロイする前に、次のことを確認してください。

適切なアクセス許可を持つ Azure サブスクリプション
Azure CLI のインストールと認証
ローカルに複製された Fabric Extensibility Toolkit リポジトリ
.\scripts\Build\BuildRelease.ps1を使用して構築されたワークロード

デプロイスクリプトの使用

Extensibility Toolkit には、デプロイプロセスを自動化する PowerShell デプロイスクリプトが scripts\Deploy\DeployToAzureWebApp.ps1 に含まれています。

基本的な展開

# Deploy to an existing Azure Web App
.\scripts\Deploy\DeployToAzureWebApp.ps1 -WebAppName "my-fabric-workload" -ResourceGroupName "fabric-workload-rg"

追加のデプロイオプション

# Deploy to staging slot with custom settings
.\scripts\Deploy\DeployToAzureWebApp.ps1 `
    -WebAppName "my-fabric-workload" `
    -ResourceGroupName "fabric-workload-rg" `
    -SlotName "staging" `
    -Force $true `
    -CreateBackup $true `
    -RestartAfterDeploy $true

デプロイスクリプトのパラメーター

パラメーター	Description	必須	既定値
`WebAppName`	デプロイする Azure Web アプリの名前	イエス	-
`ResourceGroupName`	Web アプリを含むリソースグループ	イエス	-
`ReleasePath`	ビルドされたアプリケーションファイルへのパス	いいえ	`..\..\release\app`
`DeploymentMethod`	デプロイ方法 (ZipDeploy、FTP、LocalGit)	いいえ	`ZipDeploy`
`SlotName`	ステージング用のデプロイスロット	いいえ	-
`Force`	確認プロンプトをスキップする	いいえ	`$false`
`CreateBackup`	デプロイ前にバックアップを作成する	いいえ	`$true`
`RestartAfterDeploy`	デプロイ後にアプリを再起動する	いいえ	`$true`

デプロイスクリプトの機能

デプロイスクリプトは、包括的なデプロイ機能を提供します。

検証と安全性

前提条件チェック: Azure CLI のインストールと認証を検証する
リソースの検証: ターゲット Web アプリが存在し、アクセス可能であることを確認します
ビルド検証: リリースディレクトリに必要なファイルが含まれていることを確認する
バックアップの作成: ロールバック機能用のデプロイバックアップを作成します

デプロイのワークフロー

ZIP パッケージの作成: ビルドされたアプリケーションを展開パッケージに圧縮する
サイズレポート: 検証用の展開パッケージのサイズが表示されます
進行状況の監視: リアルタイムの展開状態の更新を提供します
エラー処理: トラブルシューティングガイダンスを含む詳細なエラーメッセージ

配置後

正常性チェック: デプロイされたアプリケーションが正しく応答したことを検証します
URL レポート: デプロイされたアプリケーションへの直接リンクを提供します
マニフェストガイダンス: Fabric へのマニフェストのアップロードの次の手順を示します
タイミングメトリック: デプロイの合計期間をレポートする

手動展開

Azure PowerShell コマンドを使用して、フロントエンドアプリケーションを手動でデプロイすることもできます。

アプリケーションをビルドする

まず、テスト環境用のフロントエンドアプリケーションを構築します。

npm run build:test

デプロイパッケージを作成する

プロジェクト内の build\Frontend フォルダーに移動します
ビルドディレクトリの下にあるすべてのファイルと assets フォルダーを選択します
選択したすべてのファイルを含む .zip ファイルを作成する

Azure PowerShell を使用してデプロイする

# Connect to Azure
Connect-AzAccount

# Set your subscription context
Set-AzContext -Subscription "<subscription_id>"

# Deploy the zip file to your web app
Publish-AzWebApp -ResourceGroupName <resource_group_name> -Name <web_app_name> -ArchivePath <zip_file_path>

手動デプロイパラメーター

パラメーター	Description	Example
`<subscription_id>`	Azure サブスクリプション ID	`12345678-1234-1234-1234-123456789012`
`<resource_group_name>`	Web アプリを含むリソースグループ	`fabric-workload-rg`
`<web_app_name>`	Azure Web アプリの名前	`my-fabric-workload`
`<zip_file_path>`	デプロイメントZIPファイルへのフルパス	`C:\path\to\deployment.zip`

注

手動デプロイでは、適切な Azure アクセス許可と Azure PowerShell モジュールがマシンにインストールされている必要があります。

セキュリティに関する考慮事項

認証フロー

ワークロードは、標準の OAuth 2.0 フローを使用して Fabric で認証します。

ユーザーが Fabric を使用してワークロードにアクセスする
ファブリックがAzureでホストされているアプリケーションにリダイレクトする
アプリが認証のために Entra ID にリダイレクトされる
Entra ID が認証トークンを返す
アプリでトークンを使用して Fabric API にアクセスする

セキュリティで保護された構成

環境変数: コードではなく Azure アプリ設定に構成を格納する
Key Vault の統合: マネージド ID を使用してシークレットにアクセスする
HTTPS のみ: すべての通信に HTTPS を適用する
CORS 構成: ファブリックドメインに適切な CORS ポリシーを構成する

ベストプラクティス

最小特権: マネージド ID に最低限必要なアクセス許可を付与する
シークレットのローテーション: Key Vault に格納されているシークレットを定期的にローテーションする
ネットワークセキュリティ: 可能な場合はプライベートエンドポイントを使用する
監視: セキュリティ監視のために Application Insights を有効にする

デプロイ後の構成

Azure App Service の構成

デプロイ後、Azure App Service を構成します。

# Set environment variables for your workload
az webapp config appsettings set --name "my-fabric-workload" --resource-group "fabric-workload-rg" --settings \
    "FABRIC_CLIENT_ID=your-client-id" \
    "FABRIC_TENANT_ID=your-tenant-id" \
    "KEY_VAULT_URL=https://your-keyvault.vault.azure.net/"

Key Vault の設定

Key Vault に機密性の高い構成を格納する:

# Store client secret
az keyvault secret set --vault-name "your-keyvault" --name "FabricClientSecret" --value "your-client-secret"

# Store API keys
az keyvault secret set --vault-name "your-keyvault" --name "ExternalApiKey" --value "your-api-key"

マネージド ID の構成

Key Vault アクセスのマネージド ID を構成します。

# Enable system-assigned managed identity
az webapp identity assign --name "my-fabric-workload" --resource-group "fabric-workload-rg"

# Grant access to Key Vault
az keyvault set-policy --name "your-keyvault" \
    --object-id "managed-identity-principal-id" \
    --secret-permissions get list

マニフェストの展開

アプリケーションを Azure にデプロイした後、マニフェストパッケージを Fabric にアップロードする必要があります。

マニフェストパッケージをビルドする

まず、マニフェストパッケージをビルドします。

.\scripts\Build\BuildManifestPackage.ps1

これにより、ワークロードマニフェストを含む release\ManifestPackage.1.0.0.nupkg が作成されます。

Fabric 管理ポータルへのアップロード

Microsoft Fabric 管理ポータルを開く
ワークロード管理>ワークロードのアップロードに移動します
ManifestPackage.1.0.0.nupkg ファイルをアップロードする
ワークロードの設定とアクセス許可を構成する
テナントのワークロードをアクティブ化する

Azure デプロイ用のマニフェストを更新する

Azure デプロイ用のマニフェストパッケージをビルドする前に、 .env ファイル内の値 ( FRONTEND_URL、 FRONTEND_APPID、その他の必要な変数など) が Azure 環境に対して正しく設定されていることを確認します。これらの値は、ビルドプロセス中に WorkloadManifest.xml に置き換えます。

必要な環境変数の完全な一覧と設定に関するガイダンスについては、一般的な公開要件を参照してください。

監視とトラブルシューティング

Application Insights

Application Insights を有効にして監視する:

パフォーマンスの監視: ページの読み込み時間とユーザー操作を追跡する
エラー追跡: JavaScript エラーと失敗した要求を監視する
使用状況分析: ユーザーがワークロードと対話する方法を理解する
カスタムテレメトリ: ビジネスロジック用のカスタムメトリックを追加する

一般的な問題と解決策

デプロイの失敗

認証エラー: Azure CLI のログインを確認する az account show
リソースが見つかりません: Web アプリ名とリソースグループが正しいことを確認する
アクセス許可が拒否されました: アカウントにリソースグループに対する共同作成者ロールがあることを確認する

注

エラー: フロントエンド URI がテナントドメインの一覧にない: このエラーは、ワークロードのカスタムドメインが Entra ID テナントの承認済みドメインの一覧に登録されていないことを意味します。解決するには、カスタムドメインを Entra ID に追加します。詳細については、一般的な公開要件のカスタムドメイン検証を参照してください。

ランタイムの問題

白い画面: ブラウザーコンソールで JavaScript エラーを確認する
認証エラー: Entra ID アプリの登録とリダイレクト URI を確認する
API 呼び出しエラー: CORS の構成と API のアクセス許可を確認する

パフォーマンスの最適化

読み込みに時間がかかる: 圧縮を有効にしてバンドルサイズを最適化する
キャッシュの問題: Front Door で適切なキャッシュヘッダーを構成する
地理的な待機時間: Front Door がグローバルルーティング用に適切に構成されていることを確認する

ワークロードを発行して管理する方法 - Fabric にマニフェストをアップロードする
セットアップガイド - 開発環境の初期セットアップ
チュートリアル: 作業の開始 - Extensibility Toolkit の概要

フィードバック

このページはお役に立ちましたか?

Last updated on 2025-12-04