Share via

Web 静的ファイルをデプロイする

  • [アーティクル]

Note

Azure Spring Apps は、Azure Spring Cloud サービスの新しい名前です。 サービスの名前は新しくなりましたが、スクリーンショット、ビデオ、図などの資産の更新に取り組んでいる間、場所によってはしばらく古い名前が表示されます。

この記事の適用対象:❌ Basic または Standard ✔️ Enterprise

この記事では、Tanzu Web Servers buildpack を使用して、静的ファイルを Azure Spring Apps Enterprise プラン インスタンスにデプロイする方法について説明します。 この方法は、HTML、CSS、または選択した JavaScript フレームワークを使用して構築されたフロントエンド アプリケーションなどの静的ファイルを保持するためのアプリケーションがある場合に便利です。 これらのアプリケーションは、自動的に構成された Web サーバー (HTTPD と NGINX) を使用して直接デプロイして、それらの資産を提供できます。

前提条件

静的ファイルをデプロイする

Note

この記事では、デプロイの構成と、Web 静的ファイルの展開に固有のトラブルシューティングについて説明します。 Azure Springs Apps Enterprise プランの一般的なビルドとデプロイのシナリオについては、「Tanzu Build Service の使用」の「Build service on demand」セクションと Polyglot アプリのデプロイ方法に関するセクションを参照してください。

NGINX または HTTPD Web サーバーを使用して、次の方法で静的ファイルを Azure Spring Apps にデプロイできます。

  • 静的ファイルは直接デプロイできます。 Azure Spring Apps では、静的ファイルを提供するように指定された Web サーバーを自動的に構成します。
  • 任意の JavaScript フレームワークでフロントエンド アプリケーションを作成し、ソース コードから動的フロントエンド アプリケーションをデプロイできます。 Azure Spring Apps はアプリを静的コンテンツにビルドし、構成された Web サーバーを使用して静的ファイルを処理します。

サーバー構成ファイルを作成して、Web サーバーをカスタマイズすることもできます。

配置例

このセクションの Azure CLI の例では、次の 2 つのコンテナー レジストリ シナリオの静的ファイルのビルドとデプロイを示します。

  • Azure Spring Apps マネージド コンテナー レジストリ。
  • ユーザーが管理するコンテナー レジストリ。

静的ファイルを直接ビルドしてデプロイする

この例では、自動生成された既定のサーバー構成ファイルを使用して静的ファイルを直接デプロイします。

次のコマンドは、静的ファイルをデプロイします。

az spring app deploy
    --resource-group <resource-group-name> \
    --service <Azure-Spring-Apps-instance-name> \
    --name <app-name> \
    --source-path <path-to-source-code> \
    --build-env BP_WEB_SERVER=nginx

環境変数の使用については、「自動生成されたサーバー構成ファイルの構成」セクションを参照してください。

フロントエンド アプリケーションを静的コンテンツとしてビルドしてデプロイする

この例では、ソース コードから動的フロントエンド アプリケーションをデプロイします。

次のコマンドは、アプリケーションをデプロイします。

az spring app deploy \
    --resource-group <resource-group-name> \
    --service <Azure-Spring-Apps-instance-name> \
    --name <app-name> \
    --source-path <path-to-source-code> \
    --build-env BP_WEB_SERVER=nginx BP_NODE_RUN_SCRIPTS=build BP_WEB_SERVER_ROOT=build

カスタマイズされた構成ファイルを使用して静的ファイルをビルドしてデプロイする

この例では、カスタマイズされたサーバー構成ファイルを使用して静的ファイルをデプロイします。

次のコマンドは、アプリケーションをデプロイします。

az spring app deploy \
    --resource-group <resource-group-name> \
    --service <Azure-Spring-Apps-instance-name> \
    --name <app-name> \
    --source-path <path-to-source-code>

詳細については、この記事の 「カスタマイズされたサーバー構成ファイル を使用する」セクションを参照してください。

サンプル コード

Note

サンプル コードは、Paketo オープンソース コミュニティによって管理されています。

Paketo ビルドパック サンプルは、次のユース ケースを含む、いくつかの異なるアプリケーションの種類の一般的なユース ケースを示しています。

  • HTTPD または NGINX のいずれかを選択するために BP_WEB_SERVER を使用して、既定のサーバー構成ファイルで静的ファイルを提供します。
  • Node パッケージ マネージャー を使用して、Web サーバーが提供できる静的ファイルに React アプリをビルドします。 次の手順を使用します。
    1. 運用環境に対応した静的アセットをビルドする package.json ファイルの scripts プロパティの下にスクリプトを定義します。 React の場合は build です。
    2. ビルド スクリプトの実行後に静的資産が格納される場所を確認します。 React の場合、静的アセットは既定で ./build に格納されます。
    3. BP_NODE_RUN_SCRIPTS をビルド スクリプトの名前に設定します。
    4. BP_WEB_SERVER_ROOT をビルド出力ディレクトリに設定します。
  • HTTPD または NGINX を使用して、独自のサーバー構成ファイルで静的ファイルを提供します。

自動生成されたサーバー構成ファイルを構成する

環境変数を使用して、自動生成されたサーバー構成ファイルを変更できます。 次の表は、サポートされている環境変数を示しています。

環境変数 サポートされる値 説明
BP_WEB_SERVER nginx または httpd Web サーバーの種類 (Nginx の場合は nginx、Apache HTTP サーバーの場合は httpd) を指定します。 自動生成されたサーバー構成ファイルを使用する場合に必要です。
BP_WEB_SERVER_ROOT /workspace に対する絶対ファイル パスまたはファイル パス。 静的ファイルのルート ディレクトリを設定します。 既定値は、public です。
BP_WEB_SERVER_ENABLE_PUSH_STATE true または false アプリケーションのプッシュ状態ルーティングを有効にします。 要求されたルートに関係なく、index.html は常に提供されます。 シングルページ Web アプリケーションに便利です。
BP_WEB_SERVER_FORCE_HTTPS true または false HTTPS プロトコルを使用するすべての要求をリダイレクトして、サーバー接続に HTTPS を適用します。

次の環境変数はサポートされていません。

  • BP_LIVE_RELOAD_ENABLED
  • BP_NGINX_VERSION
  • BP_HTTPD_VERSION

カスタマイズされたサーバー構成ファイルを使用する

Web サーバーは、カスタマイズされたサーバー構成ファイルを使用して構成できます。 次の表に、構成ファイルのパスを示します。

Web サーバー 既定の構成ファイル のパス サーバー構成ファイルのパスをカスタマイズする方法
nginx ソース コードのルート パスの下にある nginx.conf 。 環境変数 BP_NGINX_CONF_LOCATION を使用して、構成ファイル名を指定します。 ソース コードのルート パスの下にファイルを配置します。
httpd ソース コードのルート パスの下にある httpd.conf 。 サポートされていません。

構成ファイルは、次の表で説明する制限に準拠している必要があります。

構成 説明 Nginx の構成 Httpd の構成
リッスン ポート Web サーバーはポート 8080 でリッスンする必要があります。 サービスでは、TCP のポートで応答性とライブ性を確認します。 構成ファイルでテンプレート化された変数 PORT を使用する必要があります。 Web サーバーの起動時に、適切なポート番号が挿入されます。 listen {{PORT}} Listen "${PORT}"
ログのパス コンソールへの構成ログ パス。 access_log /dev/stdout, error_log stderr ErrorLog /proc/self/fd/2
書き込みアクセス許可を持つファイル パス Web サーバーには、/tmp ディレクトリへの書き込みアクセス許可が付与されます。 完全パスを構成するには、/tmp ディレクトリの書き込みアクセス許可が必要です。 例: client_body_temp_path /tmp/client_body_temp
クライアント要求の許容される本文の最大サイズ Web サーバーはゲートウェイの背後にあります。 クライアント要求の最大許容本文サイズはゲートウェイで 500 m に設定され、Web サーバーの値は 500 m 未満である必要があります。 client_max_body_size 500 m 未満にする必要があります。 LimitRequestBody 500 m 未満にする必要があります。

ビルドパックのバインド

静的ファイルを Azure Spring Apps Enterprise プランにデプロイすると、Dynatrace buildpack バインドがサポートされます。 htpasswd ビルドパック バインドはサポートされていません。

詳細については、「APM 統合と CA 証明書を構成する方法」を参照してください。

ビルドとデプロイに関する一般的なエラー

静的ファイルを Azure Spring Apps Enterprise インスタンスにデプロイすると、次の一般的なビルド エラーが発生する可能性があります。

  • ERROR: No buildpack groups passed detection.
  • ERROR: Please check that you're running against the correct path.
  • ERROR: failed to detect: no buildpacks participating

これらのエラーの根本原因は、Web サーバーの種類が指定されていないことです。 これらのエラーを解決するには、環境変数 BP_WEB_SERVER を nginx または httpd に設定します。

次の表では、静的ファイルを Azure Spring Apps Enterprise にデプロイするときの一般的なデプロイ エラーについて説明します。

エラー メッセージ 根本原因 解決策
112404: Exit code 0: purposely stopped, please refer to https://aka.ms/exitcode Web サーバーが起動に失敗しました。 サーバー構成ファイルを検証して、構成エラーがあるかどうかを確認します。 次に、「カスタマイズされたサーバー構成ファイルの使用」セクションで説明されている制限に構成ファイルが準拠しているかどうかをチェックします。
mkdir() "/var/client_body_temp" failed (13: Permission denied) Web サーバーには、指定したパスへの書き込みアクセス許可がありません。 ディレクトリ /tmp の下にパスを構成します。例: /tmp/client_body_temp。

次のステップ