このたび、Azure Storage のすべてのパブリック クラウド リージョンにて、静的 Web サイトをご利用いただけるようになりました。

静的 Web サイトの概要

静的 Web サイトとは、事前に定義されたファイル セットを読み込んで静的にサービスを提供する Web サイトです。今回のリリースにより、HTML、CSS、JavaScript で作成した静的 Web サイトを Azure Storage でホストできるようになりました。ASP.NET、Java、Node のランタイムで作成した動的 Web サイトをホストしたい場合は、Azure Web Apps を使用するとランタイムで Web コンテンツを動的に生成して提供できます。

静的 Web サイトはクライアント側 JavaScript を使用するのが効果的です。React.js や Angular などの人気のフレームワークを使用して構築した Web アプリを、Azure Blob Storage でホストすることができます。サーバー側でデータを操作および処理する場合は、Azure Cognitive Services などの関連マネージド Azure サービス、または Azure Functions でホストされている自社 Web サーバーで対応できます。

すぐに始める

Azure Storage では、Web サイトを高いコスト効率で簡単にホストできます。Azure Storage アカウントで静的 Web サイトのホスティングを有効化すると、「$web」という名前のコンテナーが自動的に作成されるので、ホスティングするには、このコンテナーに静的コンテンツをアップロードします。このコンテンツは Web エンドポイント (myaccount.z20.web.core.windows.net など) からアクセスでき、既定のページや 404 エラー ページを自由に設定することもできます。

静的 Web サイトのホスティングは、Azure Portal、Azure CLI、Azure PowerShell から有効化できます。チュートリアル シリーズをご覧になりたい方は、Azure Storage での Web サイトのホストと SSL 証明書のカスタム ドメインの構成に関するページをご覧ください。

サンプル Web サイト – 独自の Azure Storage 用ファイル ブラウザー

静的 Web サイトのホスティングを使用して、Azure Storage 内のデータを扱う Web サイトを構築することがあります。この場合、RBAC ロールと Azure Active Directory 認証によるファイル保護でデータのセキュリティを確保しながら、Azure JavaScript SDK でデータを操作することができます。以下の例では、新しい Azure Storage SDK for JS を使用して Blob Storage 内のファイルのリストを作成し、静的にホストされる Web サイトのファイル ブラウザーに表示します。ここでは Azure Blob Storage の操作に匿名認証を使用していますが、Azure AD 認証でデータへのアクセスを制限することもできます。

サンプルは GitHub から入手できます。また、こちらのデモもご覧ください。

分散型アーキテクチャの普及に伴い、現在、さまざまな静的 Web サイトの活用法があります。一般的なのは、サーバーレス アプリケーションをクラウド上に構築し、フロントエンドを作成する場合です。静的 Web サイトをフロントエンドとして活用するサーバーレス アーキテクチャの構築については、Ignite 2018 のフォト ギャラリー デモ「Serverless compute architectures with Azure Blob Storage (Azure Blob Storage を使用したサーバーレス コンピューティング アーキテクチャ)」、および Azure でのサーバーレス Web アプリの作成に関するチュートリアルをご覧ください。

料金設定

Azure Storage では、追加料金なしで静的 Web サイトをご利用いただけます。データの保存やアクセスに関する料金は、価格ページでご確認ください。ストレージ コストに加えてデータの送信も有償となります。詳しくは帯域幅の価格ページでご確認ください。

さらに、Azure CDN を有効化して SSL 証明書を持つカスタム ドメインやカスタム URL への書き換えルールを使用する場合はAzure CDN の料金が適用されるため、使用パターンによりコストを抑えられることもあります。

フィードバックのお願い

多くのお客様に静的 Web サイトのプレビューにご参加いただき、ありがとうございました。皆様のフィードバックに基づいて、今後数か月以内にさまざまな機能強化を実施していきますので、どうぞご期待ください。ご意見は引き続き Azure フィードバック フォーラム までお気軽にお寄せください。