ストレージ アカウントを使用して静的な Web サイトをホストする

  • 1 分

静的な Web サイトにデプロイする。

これで、ローカル マシン上のアプリケーションをテストして、API をデプロイしました。次はクライアントをデプロイします。

クライアント SignalR アーキテクチャ

Web ページが読み込まれると、クライアント アプリケーションは次のようになります。

  • /api/getStocks HTTP エンドポイントから株式の現在のリストを取得します。
  • SignalR エンドポイントに接続します。 /api/negotiate HTTP エンドポイントへの接続が確立されます。
  • SignalR エンドポイントからの /api 接続からの株式変更をリッスンします。 イベントを受信すると、クライアントでは UI で株価を更新します。 接続が永続的であるため、これらの更新はブラウザーの [ネットワーク] タブには表示されません。 .

クライアントを Azure Static Web Apps にデプロイする

クライアントをホストするには、Azure Static Web Apps を使用します。 Azure Static Web Apps は、コード リポジトリから Azure に Web アプリを自動的にビルドしてデプロイするサービスです。

クライアントは、クラウド API URL を使用してビルドする必要があります。 WebPack を使用するクライアントのビルド プロセスでは、API URL がクラウド API URL に置き換えられます。 URL は .env ファイルからローカルにフェッチされます。 GitHub アクションでこの値を取得するには、GitHub リポジトリでシークレットとして設定する必要があります。