簡介
この実践では、ユーザーは Tencent Cloud Object Storage(COS)で静的ウェブサイトをホスティングでき、訪問者は COS が提供する静的ウェブサイトのドメイン名またはバインドされたカスタムドメイン名(例:www.example.com)を通じてホスティングされている静的ウェブサイトにアクセスできます。既存の静的ウェブサイトを COS にホスティングしたい場合でも、ゼロからウェブサイトを構築したい場合でも、この実践は COS で静的ウェブサイトをホスティングするのに役立ちます。以下に具体的な手順を説明します。
注意:
2024年1月1日以降に作成されたバケットについては、デフォルトドメイン名(静的ウェブサイトのドメイン名を含む)を使用してファイルにアクセスする場合、プレビューはサポートされません。詳細については、COSバケットドメイン名の使用に関するセキュリティ管理通知 をご覧ください。静的ウェブサイトを有効にした後、カスタムドメイン名(ソースサーバータイプを静的ウェブサイトに設定)を構成し、カスタムドメイン名を使用してアクセスすることをお勧めします。 COS のデフォルトドメインを使用してアクセスすると、静的ウェブサイトとしては表示されません。
前提条件
実践過程で使用する可能性のある関連サービスは以下の通りです:
ドメイン名の登録:静的なウェブサイトをホスティングする前に、www.example.com のようなドメイン名をお持ちでなければなりません。ドメイン名は、腾讯云の ドメイン名の登録 を通じて申請できます。 对象存储 COS:COS を使用してバケットを作成し、アップロードした Web ページのコンテンツはバケットに保存されます。 DNS解析関連サービス:DNS解析を利用し、カスタムドメインを使用して静的ウェブサイトにアクセスする目的を実現します。
説明:
本ガイドのすべての手順では、www.example.com を例として使用しています。実際の操作では、このドメイン名をご自身のドメイン名に置き換えてください。
ステップ1: ドメイン名を登録する
ドメイン名の登録は、インターネット上であらゆるサービスを構築する基礎です。お使いの具体的な状況に応じて操作してください。
既にドメインを登録済みの場合、このステップはスキップしてステップ2に進んでください。 ステップ2: ストレージバケットを作成してコンテンツをアップロードする
ドメイン名の登録後、COSコンソールで以下のタスクを実行して、ウェブサイトのコンテンツを作成および構成する必要があります。
1. ストレージバケットを作成する
腾讯云アカウントを使用してCOSコンソール にログインし、自分のウェブサイト用に対応するバケットを作成してください。バケットはデータを保存するために使用され、ウェブサイトのコンテンツを1つのバケットに保存できます。 COS を初めて使用する場合は、コンソールの概要画面で バケットの作成 をクリックして直接バケットを作成するか、左側の バケットリスト ナビゲーションバーをクリックして作成します。詳細な手順については、バケットの作成 を参照してください。 2. ストレージバケットを構成してコンテンツをアップロードする
1. バケットの静的ウェブサイト設定を有効にするには、以下の手順を実行します。詳細なガイドについては、静的ウェブサイトの設定を参照してください。 1.1 COS コンソール にログインし、左側のメニューバーで バケットリスト をクリックし、作成したバケットを検索して右側の 設定管理 をクリックします。 1.2 左側のメニューバーで 基本設定 > 静的ウェブサイト の順に選択し、編集 をクリックします。現在の状態を「有効」に設定し、インデックスドキュメントを index.html として、その他は一時構成しないで、保存 をクリックします。
2. 作成済みのバケットにウェブサイトのコンテンツをアップロードします。詳細な操作については、オブジェクトのアップロード を参照してください。 バケットに保管できる内容は、テキストファイル、写真、ビデオ、ホスティングしたい任意のコンテンツです。まだウェブサイトを構築していない場合は、このガイドに従ってファイルを作成するだけです。
たとえば、以下の HTML を使用してファイルを作成し、バケットにアップロードできます。ウェブサイトのホームページのファイル名は通常、index.html です。後続の手順で、このファイルをウェブサイトのインデックスドキュメントとして提供します。
<!DOCTYPE html>
<html>
<head>
<title>Hello COS!</title>
<meta charset="utf-8">
</head>
<body>
<p>COSの静的ウェブサイト機能をご利用いただき、ありがとうございます。</p>
<p>これはホームページです!</p>
</body>
</html>
注意:
静的ウェブサイト機能を有効にすると、ユーザーがファイル指向のない最初のディレクトリにアクセスしたとき、COSは対応するストレージバケットディレクトリのindex.htmlをデフォルトで優先的に照合し、次にindex.htmを照合します。これらのファイルがない場合、404が返されます。
ステップ3: カスタムドメイン名をバインドする
1. ドメイン名を追加する
1. COS コンソール にログインし、左側のメニューバーで バケットリストをクリックして、ウェブサイトのコンテンツを保存するバケットをクリックして、バケットに入ります。 2. 左側のメニューバーで ドメイン名と転送管理 > カスタムオリジンドメイン名 をクリックし、カスタムオリジンドメイン名の管理ページに進みます。
3. カスタムソースサーバードメイン名 のフィールドに、ドメイン名を追加をクリックし、主な設定項目の説明は以下の通りです。
オリジンサーバータイプ: 静的ウェブサイトオリジン を選択します。
4. 作成 をクリックします。設定完了後、しばらく待って、ドメイン名のデプロイとオンラインが完了するのを待ちます。その後、対応するCNAMEレコードをコピーし、ドメイン名の解析の手順を実行します。 2. ドメイン名の解析
お使いのカスタムドメインにCNAMEレコードを追加し、上記のドメイン名の追加手順で対応するCNAMEレコードを指し示す必要があります。ドメイン名の構成に関する詳細は、付録:ドメイン名の構成 をご覧ください。 ステップ4:テストと検証
上記の手順を完了した後、ブラウザのアドレスバーにウェブサイトのドメイン名を入力してアクセスし、実践結果を検証することができます。例としてwww.example.comを使用します。
http://www.example.com ——バケット名が example のインデックスページ(index.html)に戻ります。
http://www.example.com/folder/ ——バケット名が example の folder ディレクトリ内のインデックスページ(folder/index.html)に戻ります。
http://www.example.com/test.html(存在しないファイル) ——404のヒントが返されます。エラードキュメントをカスタマイズする必要がある場合は、ステップ2で静的ウェブサイトを構成する際に、エラードキュメントの設定を追加してください。これにより、存在しないファイルにアクセスしたときに指定されたエラードキュメントが表示されます。説明:
場合によっては、ブラウザのキャッシュをクリアしてから、期待する結果を表示する必要があります。
エラードキュメントはサブディレクトリに配置できます(例: pages/404.html)。ただし、異なるサブディレクトリに対して異なるエラードキュメントを構成することはサポートされていません。各バケットにはエラードキュメントを1つだけ構成できます。