本頁說明如何設定 Cloud Storage 值區來代管您網域的靜態網站。靜態網頁可能會運用到 HTML、CSS 和 JavaScript 等用戶端技術,且不得包含伺服器端指令碼 (如 PHP) 的動態內容。
總覽
由於 Cloud Storage 本身不支援透過 HTTPS 使用自訂網域,本教學課程會搭配外部應用程式負載平衡器使用 Cloud Storage,透過 HTTPS 從自訂網域提供內容。如要進一步瞭解如何透過 HTTPS 從自訂網域提供內容,請參閱 HTTPS 服務疑難排解。您也可以使用 Cloud Storage 透過 HTTP 提供自訂網域內容,這不需要負載平衡器。
如需靜態網頁的範例和提示,包括如何託管動態網站的靜態資產,請參閱靜態網站頁面。
本頁面的操作說明將說明如何執行下列步驟:
上傳及分享您網站的檔案。
設定負載平衡器和 SSL 憑證。
將負載平衡器連線至儲存空間。
使用
A
記錄將網域指向負載平衡器。測試網站。
定價
本頁的操作說明會使用Google Cloud的下列計費元件:
請參閱「監控費用」小秘訣,進一步瞭解託管靜態網站時會產生哪些費用。
限制
您可以透過物件可供大眾讀取的值區,託管靜態網站。如果 bucket 啟用禁止公開存取,就無法用來託管靜態網站。如要使用 Cloud Storage 託管靜態網站,可以採用下列任一方法:
建立可公開存取資料的新值區。建立 bucket 時,取消勾選標示為「強制禁止公開存取這個 bucket」的方塊。建立 bucket 後,請將 Storage 物件檢視者角色授予
allUsers
主體。詳情請參閱「建立 bucket」。將現有值區的資料設為公開。詳情請參閱「共用檔案」。
事前準備
- Sign in to your Google Cloud account. If you're new to Google Cloud, create an account to evaluate how our products perform in real-world scenarios. New customers also get $300 in free credits to run, test, and deploy workloads.
-
In the Google Cloud console, on the project selector page, select or create a Google Cloud project.
-
Make sure that billing is enabled for your Google Cloud project.
-
In the Google Cloud console, on the project selector page, select or create a Google Cloud project.
-
Make sure that billing is enabled for your Google Cloud project.
- 為專案啟用 Compute Engine API。
- 具備下列身分與存取權管理角色:Storage 管理員和 Compute 網路管理員。
- 有一個由您擁有或管理的網域。如果您目前沒有網域,可以透過許多現有服務 (例如 Cloud Domains) 來註冊新網域。
本教學課程使用的網域為
example.com
。 - 您想提供幾個網站檔案。本教學課程最適合至少有索引頁面 (
index.html
) 和 404 頁面 (404.html
) 的使用者。 - 建立 Cloud Storage bucket,用於儲存要提供的檔案。如果目前沒有值區,請建立值區。
- (選用) 如要讓 Cloud Storage 值區與網域同名,請驗證您擁有或管理要使用的網域。請務必驗證頂層網域 (如
example.com
),而非子網域 (如www.example.com
)。如果您是透過 Cloud Domains 購買網域,系統會自動進行驗證。 - 在 Google Cloud 控制台,前往「Cloud Storage bucket」頁面。
在值區清單中,按一下您建立的值區名稱。
「Bucket details」(值區詳細資料) 頁面隨即開啟,並選取「Objects」(物件) 分頁標籤。
按一下「上傳檔案」按鈕。
在檔案對話方塊中,找出並選取您需要的檔案。
安裝並初始化 gcloud CLI,以便為
Authorization
標頭產生存取權杖。使用
cURL
透過POST
物件要求呼叫 JSON API。針對上傳至名為my-static-assets
的 bucket 的檔案index.html
:curl -X POST --data-binary @index.html \ -H "Content-Type: text/html" \ -H "Authorization: Bearer $(gcloud auth print-access-token)" \ "https://storage.googleapis.com/upload/storage/v1/b/my-static-assets/o?uploadType=media&name=index.html"
安裝並初始化 gcloud CLI,以便為
Authorization
標頭產生存取權杖。使用
cURL
透過PUT
物件要求呼叫 XML API。針對上傳到名為my-static-assets
的值區的index.html
檔案:curl -X PUT --data-binary @index.html \ -H "Authorization: Bearer $(gcloud auth print-access-token)" \ -H "Content-Type: text/html" \ "https://storage.googleapis.com/my-static-assets/index.html"
- 在 Google Cloud 控制台,前往「Cloud Storage bucket」頁面。
在值區清單中,找到您要設為公開的值區名稱,然後點選這個名稱。
選取靠近頁面上方的 [Permissions] (權限) 分頁標籤。
如果「公開存取權」窗格顯示「非公開」,請按一下標示為「移除禁止公開存取功能」的按鈕,然後在隨即顯示的對話方塊中點選「確認」。
按一下「授予存取權」add_box按鈕。
系統會顯示「新增主體」對話方塊。
在「New principals」(新增主體) 欄位中輸入
allUsers
。在「請選擇角色」下拉式選單中,選取「Cloud Storage」子選單,然後點選「Storage 物件檢視者」選項。
按一下 [儲存]。
按一下「Allow public access」(允許公開存取)。
安裝並初始化 gcloud CLI,以便為
Authorization
標頭產生存取權杖。建立包含下列資訊的 JSON 檔案:
{ "bindings":[ { "role": "roles/storage.objectViewer", "members":["allUsers"] } ] }
使用
cURL
透過PUT
Bucket 要求呼叫 JSON API:curl -X PUT --data-binary @JSON_FILE_NAME \ -H "Authorization: Bearer $(gcloud auth print-access-token)" \ -H "Content-Type: application/json" \ "https://storage.googleapis.com/storage/v1/b/BUCKET_NAME/iam"
其中:
JSON_FILE_NAME
是您在步驟 2 建立的 JSON 檔案路徑。BUCKET_NAME
是要將物件設為公開的值區名稱。例如:my-static-assets
。
- 在 Google Cloud 控制台,前往「Cloud Storage bucket」頁面。
在值區清單中,找到您建立的值區。
按一下與值區相關聯的「Bucket overflow」(值區溢位) 選單 (more_vert),然後選取「Edit website configuration」(編輯網站設定)。
在網站設定對話方塊中,指定主網頁和錯誤頁面。
按一下 [儲存]。
安裝並初始化 gcloud CLI,以便為
Authorization
標頭產生存取權杖。建立 JSON 檔案,將
website
物件中的mainPageSuffix
和notFoundPage
屬性設為需要的網頁。在下列範例中,會將
mainPageSuffix
設定為index.html
,而notFoundPage
設定為404.html
:{ "website":{ "mainPageSuffix": "index.html", "notFoundPage": "404.html" } }
使用
cURL
透過PATCH
值區要求呼叫 JSON API。如為 bucketmy-static-assets
:curl -X PATCH --data-binary @web-config.json \ -H "Authorization: Bearer $(gcloud auth print-access-token)" \ -H "Content-Type: application/json" \ "https://storage.googleapis.com/storage/v1/b/my-static-assets"
安裝並初始化 gcloud CLI,以便為
Authorization
標頭產生存取權杖。建立 XML 檔案,將
WebsiteConfiguration
元素中的MainPageSuffix
和NotFoundPage
元素設為需要的網頁。在下列範例中,會將
MainPageSuffix
設定為index.html
,而NotFoundPage
設定為404.html
:<WebsiteConfiguration> <MainPageSuffix>index.html</MainPageSuffix> <NotFoundPage>404.html</NotFoundPage> </WebsiteConfiguration>
使用
cURL
透過PUT
值區要求和websiteConfig
查詢字串參數呼叫 XML API。針對my-static-assets
:curl -X PUT --data-binary @web-config.xml \ -H "Authorization: Bearer $(gcloud auth print-access-token)" \ https://storage.googleapis.com/my-static-assets?websiteConfig
前往 Google Cloud 控制台的「Load balancing」(負載平衡)頁面。
- 點選「建立負載平衡器」。
- 在「Type of load balancer」(負載平衡器類型) 部分,選取「Application Load Balancer (HTTP/HTTPS)」(應用程式負載平衡器 (HTTP/HTTPS)),然後點選「Next」(下一步)。
- 按一下 [設定]。
- 按一下「前端設定」。
- (選用) 為前端設定命名。
- 針對「Protocol」(通訊協定),選取「HTTPS (includes HTTP/2)」(HTTPS (含 HTTP/2))。
- 在「IP version」(IP 版本) 部分,選取「IPv4」。如要使用 IPv6,請參閱「IPv6 終止功能」一文。
「IP 位址」欄位:
- 在下拉式選單中,按一下「建立 IP 位址」。
- 在「Reserve a new static IP address」(保留新的靜態 IP 位址) 對話方塊中,輸入 IP 位址的「Name」(名稱),例如
example-ip
。 - 按一下「保留」。
在「Port」(通訊埠) 欄中,選取「443」。
在「Certificate」(憑證) 欄位的下拉式選單中,選取「Create a new certificate」(建立新憑證)。 面板中會顯示憑證建立表單。設定下列項目:
點選「建立」。
(選用) 如要自動設定 Google Cloud 部分 HTTP 負載平衡器,以便重新導向 HTTP 流量,請選取「Enable HTTP to HTTPS redirect」(啟用從 HTTP 重新導向至 HTTPS 的功能) 旁的核取方塊。
按一下 [完成]。
- 按一下「後端設定」。
- 在「後端服務和後端值區」下拉式選單中,按一下「建立後端值區」。
- 選擇「Backend bucket name」(後端值區名稱),例如
example-bucket
。您選擇的名稱可以與先前建立的值區名稱不同。 - 按一下「Cloud Storage bucket」(Cloud Storage 值區) 欄位中的「Browse」(瀏覽)。
- 選取先前建立的
my-static-assets
bucket,然後按一下「Select」(選取)。 - (選用) 如要使用 Cloud CDN,請勾選「啟用 Cloud CDN」核取方塊,並視需要設定 Cloud CDN。請注意,Cloud CDN 可能會產生額外費用。
- 點選「建立」。
- 按一下「檢查並完成」。
- 檢查「Frontend」(前端)、「Routing rules」(轉送規則) 和「Backend」(後端)。
- 點選「建立」。
- 前往 Google Cloud 控制台的「Load balancing」(負載平衡) 頁面。
前往「Load balancing」(負載平衡) 頁面 - 按一下負載平衡器的名稱:
example-lb
。 - 按一下與負載平衡器相關聯的 SSL 憑證名稱:
example-ssl
。 - 「狀態」和「網域狀態」列會顯示憑證狀態。兩者都必須有效,憑證才能用於您的網站。
如要檢查憑證狀態,請執行下列指令:
gcloud compute ssl-certificates describe CERTIFICATE_NAME \ --global \ --format="get(name,managed.status)"
如要檢查網域狀態,請執行下列指令:
gcloud compute ssl-certificates describe CERTIFICATE_NAME \ --global \ --format="get(managed.domainStatus)"
- In the Google Cloud console, go to the Manage resources page.
- In the project list, select the project that you want to delete, and then click Delete.
- In the dialog, type the project ID, and then click Shut down to delete the project.
- 前往 Google Cloud 控制台的「Load balancing」(負載平衡) 頁面。
前往「Load balancing」(負載平衡) 頁面 - 勾選
example-lb
旁邊的核取方塊。 - 點選「刪除」。
- (選用) 選取要連同負載平衡器一併刪除的資源旁的核取方塊,例如
my-static-assets
值區或example-ssl
SSL 憑證。 - 按一下「刪除負載平衡器」或「刪除負載平衡器和所選資源」。
前往 Google Cloud 控制台的「External IP addresses」(外部 IP 位址) 頁面。
勾選
example-ip
旁邊的核取方塊。按一下「Release static address」(釋放靜態位址)。
按一下確認視窗中的 [Delete]。
- 請參閱使用值區託管靜態網站的範例和提示。
- 請參閱託管靜態網站的疑難排解部分。
- 瞭解如何託管動態網站的靜態資產。
- 瞭解其他 Google Cloud 網路服務解決方案。
上傳網站檔案
將您想讓網站提供的檔案新增到值區內:
控制台
上傳完成後,您應該會看到檔案名稱與值區中顯示的檔案資訊。
如要瞭解如何透過 Google Cloud 控制台取得 Cloud Storage 作業失敗的詳細錯誤資訊,請參閱「疑難排解」一文。
指令列
使用 gcloud storage cp
指令將檔案複製到 bucket。
舉例來說,如要將檔案 index.html
從目前的位置 Desktop
複製到值區 my-static-assets
:
gcloud storage cp Desktop/index.html gs://my-static-assets
如果成功,回應會類似以下範例:
Completed files 1/1 | 164.3kiB/164.3kiB
用戶端程式庫
C++
詳情請參閱 Cloud Storage C++ API 參考說明文件。
如要驗證 Cloud Storage,請設定應用程式預設憑證。 詳情請參閱「設定用戶端程式庫的驗證機制」。
C#
詳情請參閱 Cloud Storage C# API 參考說明文件。
如要驗證 Cloud Storage,請設定應用程式預設憑證。 詳情請參閱「設定用戶端程式庫的驗證機制」。
Go
詳情請參閱 Cloud Storage Go API 參考說明文件。
如要驗證 Cloud Storage,請設定應用程式預設憑證。 詳情請參閱「設定用戶端程式庫的驗證機制」。
Java
詳情請參閱 Cloud Storage Java API 參考說明文件。
如要驗證 Cloud Storage,請設定應用程式預設憑證。 詳情請參閱「設定用戶端程式庫的驗證機制」。
下例示範如何上傳個別物件:
下例示範如何同時上傳多個物件:
下列範例會同時上傳具有相同前置字串的所有物件:
Node.js
詳情請參閱 Cloud Storage Node.js API 參考說明文件。
如要驗證 Cloud Storage,請設定應用程式預設憑證。 詳情請參閱「設定用戶端程式庫的驗證機制」。
下例示範如何上傳個別物件:
下例示範如何同時上傳多個物件:
下列範例會同時上傳具有相同前置字串的所有物件:
PHP
詳情請參閱 Cloud Storage PHP API 參考說明文件。
如要驗證 Cloud Storage,請設定應用程式預設憑證。 詳情請參閱「設定用戶端程式庫的驗證機制」。
Python
詳情請參閱 Cloud Storage Python API 參考說明文件。
如要驗證 Cloud Storage,請設定應用程式預設憑證。 詳情請參閱「設定用戶端程式庫的驗證機制」。
下例示範如何上傳個別物件:
下例示範如何同時上傳多個物件:
下列範例會同時上傳具有相同前置字串的所有物件:
Ruby
詳情請參閱 Cloud Storage Ruby API 參考說明文件。
如要驗證 Cloud Storage,請設定應用程式預設憑證。 詳情請參閱「設定用戶端程式庫的驗證機制」。
Terraform
REST API
JSON API
XML API
共用檔案
如要將 bucket 中的所有物件設為可供公開網際網路上的任何人讀取,請按照下列步驟操作:
控制台
公開共用後,「public access」(公開存取權) 欄中會出現各個物件的連結圖示。點選這個圖示即可取得物件的網址。
如要瞭解如何透過 Google Cloud 控制台取得 Cloud Storage 作業失敗的詳細錯誤資訊,請參閱「疑難排解」一文。
指令列
使用 buckets add-iam-policy-binding
指令:
gcloud storage buckets add-iam-policy-binding gs://my-static-assets --member=allUsers --role=roles/storage.objectViewer
用戶端程式庫
C++
詳情請參閱 Cloud Storage C++ API 參考說明文件。
如要驗證 Cloud Storage,請設定應用程式預設憑證。 詳情請參閱「設定用戶端程式庫的驗證機制」。
C#
詳情請參閱 Cloud Storage C# API 參考說明文件。
如要驗證 Cloud Storage,請設定應用程式預設憑證。 詳情請參閱「設定用戶端程式庫的驗證機制」。
Go
詳情請參閱 Cloud Storage Go API 參考說明文件。
如要驗證 Cloud Storage,請設定應用程式預設憑證。 詳情請參閱「設定用戶端程式庫的驗證機制」。
Java
詳情請參閱 Cloud Storage Java API 參考說明文件。
如要驗證 Cloud Storage,請設定應用程式預設憑證。 詳情請參閱「設定用戶端程式庫的驗證機制」。
Node.js
詳情請參閱 Cloud Storage Node.js API 參考說明文件。
如要驗證 Cloud Storage,請設定應用程式預設憑證。 詳情請參閱「設定用戶端程式庫的驗證機制」。
PHP
詳情請參閱 Cloud Storage PHP API 參考說明文件。
如要驗證 Cloud Storage,請設定應用程式預設憑證。 詳情請參閱「設定用戶端程式庫的驗證機制」。
Python
詳情請參閱 Cloud Storage Python API 參考說明文件。
如要驗證 Cloud Storage,請設定應用程式預設憑證。 詳情請參閱「設定用戶端程式庫的驗證機制」。
Ruby
詳情請參閱 Cloud Storage Ruby API 參考說明文件。
如要驗證 Cloud Storage,請設定應用程式預設憑證。 詳情請參閱「設定用戶端程式庫的驗證機制」。
Terraform
REST API
JSON API
XML API
XML API 不支援將值區中的所有物件設為可公開讀取,請改用 Google Cloud 控制台或 gcloud storage
,或為每個物件個別設定 ACL。請注意,如要為每個物件設定 ACL,必須將值區的「存取權控管」模式切換為「精細」。
如有需要,您也可以將部分值區設為公開存取。
針對非公開或不存在的檔案要求網址時,訪客會收到 http 403
回應碼。請參閱下一節,進一步瞭解如何新增顯示使用 http 404
回應碼的錯誤網頁。
建議:指派專用頁面
您可以指派索引頁面的尾碼和自訂錯誤網頁,這類網頁稱為特殊頁面。雖然不一定要指派,但如果您未指派索引頁面尾碼並上傳對應的索引頁面,使用者存取頂層網站時,系統會提供 XML 文件樹狀結構,其中包含值區中的公開物件清單。
如要進一步瞭解專業頁面的行為,請參閱「專業頁面」。
控制台
如要瞭解如何透過 Google Cloud 控制台取得 Cloud Storage 作業失敗的詳細錯誤資訊,請參閱「疑難排解」一文。
指令列
使用 buckets update
指令,並加上 --web-main-page-suffix
和 --web-error-page
旗標。
在下列範例中,會將 MainPageSuffix
設定為 index.html
,而 NotFoundPage
設定為 404.html
:
gcloud storage buckets update gs://my-static-assets --web-main-page-suffix=index.html --web-error-page=404.html
如果執行成功,指令會傳回下列內容:
Updating gs://www.example.com/... Completed 1
用戶端程式庫
C++
詳情請參閱 Cloud Storage C++ API 參考說明文件。
如要驗證 Cloud Storage,請設定應用程式預設憑證。 詳情請參閱「設定用戶端程式庫的驗證機制」。
C#
詳情請參閱 Cloud Storage C# API 參考說明文件。
如要驗證 Cloud Storage,請設定應用程式預設憑證。 詳情請參閱「設定用戶端程式庫的驗證機制」。
Go
詳情請參閱 Cloud Storage Go API 參考說明文件。
如要驗證 Cloud Storage,請設定應用程式預設憑證。 詳情請參閱「設定用戶端程式庫的驗證機制」。
Java
詳情請參閱 Cloud Storage Java API 參考說明文件。
如要驗證 Cloud Storage,請設定應用程式預設憑證。 詳情請參閱「設定用戶端程式庫的驗證機制」。
Node.js
詳情請參閱 Cloud Storage Node.js API 參考說明文件。
如要驗證 Cloud Storage,請設定應用程式預設憑證。 詳情請參閱「設定用戶端程式庫的驗證機制」。
PHP
詳情請參閱 Cloud Storage PHP API 參考說明文件。
如要驗證 Cloud Storage,請設定應用程式預設憑證。 詳情請參閱「設定用戶端程式庫的驗證機制」。
Python
詳情請參閱 Cloud Storage Python API 參考說明文件。
如要驗證 Cloud Storage,請設定應用程式預設憑證。 詳情請參閱「設定用戶端程式庫的驗證機制」。
Ruby
詳情請參閱 Cloud Storage Ruby API 參考說明文件。
如要驗證 Cloud Storage,請設定應用程式預設憑證。 詳情請參閱「設定用戶端程式庫的驗證機制」。
REST API
JSON API
XML API
設定負載平衡器和 SSL 憑證
Cloud Storage 本身不支援使用 HTTPS 的自訂網域,因此您還需要設定附加至 HTTPS 負載平衡器的 SSL 憑證,才能透過 HTTPS 提供網站服務。本節說明如何將值區新增至負載平衡器的後端,以及如何將新的Google 代管 SSL 憑證新增至負載平衡器的前端。
開始設定
系統會顯示負載平衡器的設定視窗。
基本設定
繼續設定之前,請輸入負載平衡器名稱,例如 example-lb
。
設定前端
本節說明如何設定 HTTPS 通訊協定及建立 SSL 憑證。您也可以選取現有憑證,或上傳自行管理的 SSL 憑證。
設定後端
設定轉送規則
轉送規則是外部應用程式負載平衡器的網址對應元件。在本教學課程中,您應略過負載平衡器設定的這部分,因為系統會自動設定為使用您剛才設定的後端。
檢閱設定
您可能需要稍候幾分鐘,等待系統建立負載平衡器。
將網域連結至負載平衡器
建立負載平衡器後,請按一下負載平衡器的名稱:
example-lb
。請記下與負載平衡器相關聯的 IP 位址,例如 30.90.80.100
。如要將網域指向負載平衡器,請使用網域註冊服務建立 A
記錄。如果 SSL 憑證中新增了多個網域,請為每個網域新增 A
記錄,並全部指向負載平衡器的 IP 位址。舉例來說,如要為 www.example.com
和 example.com
建立 A
記錄,請執行以下指令:
NAME TYPE DATA www A 30.90.80.100 @ A 30.90.80.100
如要進一步瞭解如何將網域連線至負載平衡器,請參閱「排解網域狀態問題」。
建議:監控 SSL 憑證狀態
佈建憑證並透過負載平衡器提供網站服務,最多可能需要 60 到 90 分鐘。 Google Cloud 如要監控憑證狀態,請按照下列步驟操作:
控制台
指令列
如要進一步瞭解憑證狀態,請參閱「排解安全資料傳輸層 (SSL) 憑證相關問題」。
測試網站
SSL 憑證生效後,請前往 https://www.example.com/test.html
,確認內容是從 bucket 提供。其中 test.html
是儲存在 bucket 中的物件,您將其做為後端。如果設定 MainPageSuffix
屬性,https://www.example.com
會前往 index.html
。
清除所用資源
完成本教學課程後,您可以清除所建立的資源,這樣資源就不會占用配額,您日後也無須為其付費。下列各節將說明如何刪除或關閉這些資源。
刪除專案
如要避免付費,最簡單的方法就是刪除您為了本教學課程所建立的專案。
如要刪除專案:
刪除負載平衡器和 bucket
如果不想刪除整個專案,請刪除您為本教學課程建立的負載平衡器和值區:
釋出保留的 IP 位址
如要刪除您在本教學課程中使用的保留 IP 位址,請按照下列步驟操作:
後續步驟
歡迎試用
如果您未曾使用過 Google Cloud,歡迎建立帳戶,親自體驗實際使用 Cloud Storage 的成效。新客戶可以獲得價值 $300 美元的免費抵免額,可用於執行、測試及部署工作負載。
免費試用 Cloud Storage