Azure Storage での静的 Web サイト ホスティングStatic website hosting in Azure Storage

$web という名前のストレージ コンテナーから直接に、静的コンテンツ (HTML、CSS、JavaScript、画像ファイル) を提供できます。You can serve static content (HTML, CSS, JavaScript, and image files) directly from a storage container named $web. Azure Storage でコンテンツをホスティングすることで、Azure Functions やその他のサービスとしてのプラットフォーム (PaaS) サービスなど、サーバーレス アーキテクチャを使用できます。Hosting your content in Azure Storage enables you to use serverless architectures that include Azure Functions and other Platform as a service (PaaS) services. Web サーバーでコンテンツをレンダリングする必要がない場合、Azure Storage の静的 Web サイト ホスティングは優れた選択肢です。Azure Storage static website hosting is a great option in cases where you don't require a web server to render content.

App Service Static Web Apps は、Azure Storage の静的 Web サイト ホスティングに代わる優れた選択肢であり、Web サイトでコンテンツのレンダリングが必要ない場合にも適してします。App Service Static Web Apps is a great alternative to Azure Storage static website hosting and is also appropriate in cases where you don't require a web server to render content. App Service Static Web Apps では、GitHub ソースからグローバル デプロイまでのフル マネージドの継続的インテグレーションと継続的デリバリー (CI/CD) ワークフローが提供されます。App Service Static Web Apps provide you with a fully managed continuous integration and continuous delivery (CI/CD) workflow from GitHub source to global deployment.

Web サーバーでコンテンツのレンダリングが必要な場合は、Azure App Service を使用できます。If you need a web server to render content, you can use Azure App Service.

注意

この記事で説明されている機能は、階層構造の名前空間を持つアカウントで使用できるようになりました。The features described in this article are now available to accounts that have a hierarchical namespace. 制限事項については、「Azure Data Lake Storage Gen2 で使用できる BLOB ストレージ機能」の記事を参照してください。To review limitations, see the Blob storage features available in Azure Data Lake Storage Gen2 article.

注意

必ず汎用 v2 Standard ストレージ アカウントを作成してください。Make sure to create a general-purpose v2 Standard storage account . 静的 Web サイトは、他の種類のストレージ アカウントでは使用できません。Static websites aren't available in any other type of storage account.

静的 Web サイトの設定Setting up a static website

静的 Web サイトのホスティングは、ストレージ アカウントで有効にする必要がある機能です。Static website hosting is a feature that you have to enable on the storage account.

静的 Web サイトのホスティングを有効にするには、既定のファイルの名前を選択してから、必要に応じて、カスタム 404 ページへのパスを指定します。To enable static website hosting, select the name of your default file, and then optionally provide a path to a custom 404 page. アカウントに $web という名前の BLOB ストレージ コンテナーがまだ存在しない場合は、自動的に作成されます。If a blob storage container named $web doesn't already exist in the account, one is created for you. このコンテナーに、サイトのファイルを追加します。Add the files of your site to this container.

手順を追ったガイダンスについては、「Host a static website in Azure Storage」 (Azure Storage で静的 Web サイトをホストする) を参照してください。For step-by-step guidance, see Host a static website in Azure Storage.

Azure Storage 静的 Web サイトのメトリック: メトリック

$web コンテナー内のファイルは大文字と小文字が区別され、匿名アクセス要求によって処理され、読み取り操作によってのみ使用できます。Files in the $web container are case-sensitive, served through anonymous access requests and are available only through read operations.

コンテンツのアップロードUploading content

これらの任意のツールを使用して、コンテンツを $web コンテナーにアップロードできます。You can use any of these tools to upload content to the $web container:

コンテンツの表示Viewing content

ユーザーは、Web サイトのパブリック URL を使用して、ブラウザーからサイトのコンテンツを表示できます。Users can view site content from a browser by using the public URL of the website. URL を見つけるには、Azure portal、Azure CLI、または PowerShell を使用します。You can find the URL by using the Azure portal, Azure CLI, or PowerShell. Web サイトの URL を検索する」を参照してください。See Find the website URL.

サーバーが 404 エラーを返し、Web サイトを有効にしたときに、エラー ドキュメントを指定していない場合、既定の 404 ページがユーザーに返されます。If the server returns a 404 error, and you have not specified an error document when you enabled the website, then a default 404 page is returned to the user.

注意

Azure Storage でのクロス オリジン リソース共有 (CORS) のサポートは、静的な Web サイトではサポートされていません。Cross-Origin Resource Sharing (CORS) support for Azure Storage is not supported with static website.

リージョン コードRegional codes

サイトの URL には、リージョン コードが含まれます。The URL of your site contains a regional code. たとえば、URL https://contosoblobaccount.z22.web.core.windows.net/ にはリージョン コード z22 が含まれています。For example the URL https://contosoblobaccount.z22.web.core.windows.net/ contains regional code z22.

そのコードは URL に残しておく必要がありますが、内部的に使用されるだけであり、他にそのコードを使用する必要はありません。While that code must remain in the URL, it is only for internal use, and you won't have to use that code in any other way.

ユーザーがサイトを開き、特定のファイル (例: https://contosoblobaccount.z22.web.core.windows.net) を指定しない場合、静的 Web サイトのホスティングを有効にしたときに指定したインデックス ドキュメントが表示されます。The index document that you specify when you enable static website hosting, appears when users open the site and don't specify a specific file (For example: https://contosoblobaccount.z22.web.core.windows.net).

セカンダリ エンドポイントSecondary endpoints

セカンダリ リージョンでの冗長性を設定した場合は、セカンダリ エンドポイントを使用して Web サイトのコンテンツにアクセスすることもできます。If you set up redundancy in a secondary region, you can also access website content by using a secondary endpoint. データはセカンダリ リージョンに非同期にレプリケートされるため、セカンダリ エンドポイントで使用できるファイルが、プライマリ エンドポイントで使用できるファイルと常に同期されているとは限りません。Because data is replicated to secondary regions asynchronously, the files that are available at the secondary endpoint aren't always in sync with the files that are available on the primary endpoint.

Web コンテナーのパブリック アクセス レベルの設定の影響Impact of the setting the public access level of the web container

$web コンテナーのパブリック アクセス レベルを変更できますが、プライマリ静的 Web サイト エンドポイントに対しては、これらのファイルが匿名アクセス要求によって処理されるため、この変更が無効になります。You can modify the public access level of the $web container, but this has no impact on the primary static website endpoint because these files are served through anonymous access requests. つまり、すべてのファイルへのパブリック (読み取り専用) アクセスです。That means public (read-only) access to all files.

次のスクリーンショットは、Azure Portal のパブリック アクセス レベル設定を示しています。The following screenshot shows the public access level setting in the Azure portal:

ポータルでパブリック アクセス レベルを設定する方法を示すスクリーンショット

プライマリ静的 Web サイト エンドポイントは影響を受けませんが、パブリック アクセス レベルの変更は、プライマリ BLOB サービス エンドポイントには有効です。While the primary static website endpoint is not affected, a change to the public access level does impact the primary blob service endpoint.

$web コンテナーのパブリック アクセス レベルをプライベート (匿名アクセスなし) から BLOB (BLOB 専用の匿名読み取りアクセス) に変更した場合、プライマリ静的 Web サイト エンドポイント https://contosoblobaccount.z22.web.core.windows.net/index.html へのパブリック アクセスのレベルは変更されません。For example, if you change the public access level of the $web container from Private (no anonymous access) to Blob (anonymous read access for blobs only), then the level of public access to the primary static website endpoint https://contosoblobaccount.z22.web.core.windows.net/index.html doesn't change.

しかし、プライマリ BLOB サービス エンドポイント https://contosoblobaccount.blob.core.windows.net/$web/index.html へのパブリック アクセスは、プライベートからパブリックに変更されます。However, the public access to the primary blob service endpoint https://contosoblobaccount.blob.core.windows.net/$web/index.html does change from private to public. ユーザーはこれらの 2 つのエンドポイントのいずれかを使用して、このファイルを開けるようになりました。Now users can open that file by using either of these two endpoints.

ストレージ アカウントでパブリック アクセスを無効にしても、そのストレージ アカウントでホストされている静的な Web サイトには影響しません。Disabling public access on a storage account does not affect static websites that are hosted in that storage account. 詳細については、コンテナーと BLOB の匿名パブリック読み取りアクセスの構成に関するページを参照してください。For more information, see Configure anonymous public read access for containers and blobs.

カスタム ドメインを静的 Web サイトの URL にマップするMapping a custom domain to a static website URL

静的 Web サイトをカスタム ドメイン経由で利用できるようにすることができます。You can make your static website available via a custom domain.

カスタム ドメインの HTTP アクセスは、Azure Storage でネイティブにサポートされているため、簡単に有効にすることができます。It's easier to enable HTTP access for your custom domain, because Azure Storage natively supports it. HTTPS を有効にするには、Azure CDN を使用する必要があります。これは、Azure Storage がカスタム ドメインを使用した HTTPS をまだネイティブにサポートしていないためです。To enable HTTPS, you'll have to use Azure CDN because Azure Storage does not yet natively support HTTPS with custom domains. 手順を追ったガイダンスについては、「カスタム ドメインを Azure Blob Storage エンドポイントにマップする」を参照してください。see Map a custom domain to an Azure Blob Storage endpoint for step-by-step guidance.

ストレージ アカウントが HTTPS 経由での安全な転送を必要とするように構成されている場合、ユーザーは HTTPS エンドポイントを使用する必要があります。If the storage account is configured to require secure transfer over HTTPS, then users must use the HTTPS endpoint.

ヒント

Azure でドメインをホストすることを検討してください。Consider hosting your domain on Azure. 詳しくは、「Azure DNS でドメインをホストする」を参照してください。For more information, see Host your domain in Azure DNS.

HTTP ヘッダーの追加Adding HTTP headers

静的 Web サイト機能の一部としてヘッダーを構成する方法はありません。There's no way to configure headers as part of the static website feature. ただし、Azure CDN を使用してヘッダーを追加したり、ヘッダー値を追加 (または上書き) したりすることができます。However, you can use Azure CDN to add headers and append (or overwrite) header values. Azure CDN の Standard ルール エンジン リファレンス」を参照してください。See Standard rules engine reference for Azure CDN.

ヘッダーを使用してキャッシュを制御する場合は、「キャッシュ規則で Azure CDN キャッシュの動作を制御する」を参照してください。If you want to use headers to control caching, see Control Azure CDN caching behavior with caching rules.

複数リージョンでの Web サイトのホスティングMulti-region website hosting

複数の地域で Web サイトをホストすることを計画している場合は、リージョンのキャッシュに Content Delivery Network を使用することをお勧めします。If you plan to host a website in multiple geographies, we recommend that you use a Content Delivery Network for regional caching. 各リージョンで異なるコンテンツを提供する場合は、Azure Front Door を使用します。Use Azure Front Door if you want to serve different content in each region. これにより、フェールオーバー機能も提供されます。It also provides failover capabilities. カスタム ドメインを使用する予定の場合、Azure Traffic Manager はお勧めしません。Azure Traffic Manager is not recommended if you plan to use a custom domain. Azure Storage でのカスタム ドメイン名の確認方法が原因で問題が発生する可能性があります。Issues can arise because of how Azure Storage verifies custom domain names.

価格Pricing

静的 Web サイトのホスティングは無料で有効にできます。You can enable static website hosting free of charge. サイトで利用した BLOB ストレージと、運用コストに対してのみ課金されます。You're billed only for the blob storage that your site utilizes and operations costs. Azure Blob Storage の価格について詳しくは、Azure Blob Storage の料金に関するページをご覧ください。For more details on prices for Azure Blob Storage, check out the Azure Blob Storage Pricing Page.

メトリックMetrics

静的 Web サイトのページでメトリックを有効にできます。You can enable metrics on static website pages. メトリックを有効にすると、 $web コンテナーのファイルに関するトラフィック統計情報が、メトリック ダッシュボードでレポートされます。Once you've enabled metrics, traffic statistics on files in the $web container are reported in the metrics dashboard.

静的 Web サイトのページでメトリックを有効にするには、「Enable metrics on static website pages」 (静的 Web サイト ページでメトリックを有効にする) を参照してください。To enable metrics on your static website pages, see Enable metrics on static website pages.

次のステップNext steps