您可以通過存儲空間(Bucket)托管靜態網站,并讓訪問者通過Bucket綁定的自定義域名(例如example.com)訪問您的網站。無論您是想在OSS上托管已有靜態網站還是從零開始建站,都可以從此教程中獲得幫助。
步驟1:注冊域名
搭建靜態網站前,您需要為網站準備一個域名。建議您使用阿里云域名服務快速注冊一個屬于您的域名。詳細步驟,請參見注冊通用域名。
本示例使用example.com
作為測試域名。
若您注冊的域名需綁定在中國內地的Bucket上,您還需在中國工信部備案域名。詳細步驟,請參見備案。
步驟2:創建Bucket
您需要創建一個公共讀的Bucket,用以設置靜態網站托管及存放網站數據。
步驟3:創建網頁文件并上傳
您需要創建靜態網站首頁和404錯誤頁面的網頁文件,并上傳至目標Bucket。
在本地創建兩個HTML格式的文件。
默認首頁
本示例使用以下內容生成靜態網站的首頁文件index.html。實際環境中,請根據您的需求生成首頁文件內容。
<html> <head> <title>Hello OSS!</title> <meta charset="utf-8"> </head> <body> <p>開始阿里云OSS托管</p> <p>這是索引頁面</p> </body> </html>
默認404頁
本示例使用以下內容生成靜態網站的404錯誤頁文件error.html。實際環境中,請根據您的需求生成404錯誤頁文件的內容。
<html> <head> <title>Hello OSS!</title> <meta charset="utf-8"> </head> <body> <p>這是404錯誤頁面</p> </body> </html>
將網頁文件上傳至目標Bucket。
單擊Bucket 列表,然后單擊目標Bucket名稱。
在左側導航欄,選擇 。
單擊上傳文件。
在上傳文件面板中,在待上傳文件區域選中已創建的兩個網頁文件,其他參數保留默認配置。
單擊上傳文件。
步驟4:配置靜態網站托管
在左側導航欄,選擇 。
在靜態頁面,單擊設置,然后將index.html設置為默認首頁,將error.html設置為默認404頁。
說明若您希望訪問子目錄時可以跳轉到子目錄下index.html文件,您可以選擇開通子目錄首頁。詳情請參見設置靜態網站托管。
單擊保存。
步驟5:綁定自定義域名
現在,您已有了根域名example.com
和名為examplebucket的Bucket,接下來您需要將域名綁定到Bucket,以便能夠使用您的域名訪問Bucket。
在左側導航欄,選擇 。
在域名管理頁面,單擊綁定域名。
在域名文本框輸入example.com,單擊確認綁定,然后開啟自動添加CNAME記錄開關。
等待域名狀態顯示已生效。
步驟5:(可選)使用阿里云CDN加快網站速度
您可以使用阿里云CDN改善網站性能。CDN可以讓您的網站文件(如HTML、圖像和視頻)緩存至全球各地的數據中心。當訪問者從您的網站請求文件時,CDN會自動將請求重定向到最近數據中心上的文件副本,提升訪問者的下載速度。
記錄CDN加速域名生成的CNAME值。
在左側導航欄,選擇
。單擊目標域名右側的未配置,跳轉至CDN控制臺。
在添加域名頁面,所有參數保留默認配置,單擊下一步,然后單擊返回域名列表。
記錄域名生成的CNAME值example.com.w.kunlunsl.com。
解析CDN加速域名。
在DNS控制臺的域名解析列表,單擊目標域名右側的解析設置。
找到綁定自定義域名時自動添加的CNAME記錄,單擊修改。
在修改記錄面板,將記錄值修改為example.com.w.kunlunsl.com,其他參數保持默認配置,然后單擊確定。
步驟6:測試網站
在瀏覽器中訪問以下URL以驗證網站是否正常運行:
訪問靜態網站首頁
http://example.com
,配置正確時顯示如下頁面:訪問Bucket中不存在的文件
http://example.com/example.txt
,配置正確時顯示如下頁面:
步驟7:清理資源
本教程中創建的資源僅為測試環境使用,建議您在測試完成后清理資源,以免產生不必要的費用。