文档首页/ 对象存储服务 OBS/ 最佳实践/ 使用自定义域名托管静态网站

更新时间：2024-10-17 GMT+08:00

查看PDF

使用自定义域名托管静态网站

应用场景

当企业有大量静态网站需要提供给用户访问，却不想搭建网站服务器时，可以将静态网站托管在OBS桶中，用户可以直接通过OBS桶绑定的自定义域名访问托管的静态网站。

方案架构

图1 使用自定义域名访问静态网站示意图

企业将静态网站托管至OBS桶中，并为OBS桶绑定对外的自定义域名。
用户访问自定义域名时，即可直接访问到存储在OBS桶中的静态网站。

在此之前，您可能需要了解一些关于OBS静态网站托管的基本概念及操作，详情请参阅静态网站托管。

方案优势

快速构建基于静态内容的网站，简化建站流程，降低运营成本。
无需搭建服务器，静态网站轻松上线。

资源和成本规划

本节介绍最佳实践中资源规划情况，包含以下内容：

表1 资源和成本规划说明
资源	资源说明	成本说明
OBS	需要创建一个OBS桶用于存放静态网站文件，同时在OBS桶上完成静态网站托管配置和自定义域名绑定。	OBS的使用涉及以下几项费用：存储费用：静态网站文件存储在OBS中产生的存储费用。请求费用：用户访问OBS中存储的静态网站文件时产生的请求费用。流量费用：用户使用自定义域名通过公网访问OBS时产生的流量费用。实际产生的费用与存储的文件大小、用户访问所产生的请求次数和流量大小有关，请根据自己的业务进行预估。
静态网站文件	静态网站首页：访问静态网站时返回的索引页面，即首页。示例：index.html 404错误页面：当访问错误的静态网站路径时，返回的404错误页面。示例：error.html	免费
自定义域名	用户自己的域名地址，需要绑定在OBS桶上。按照工信部要求，您绑定自定义域名的桶如果在以下区域，需要提前完成ICP备案。包括：华北-北京一、华北-北京四、华东-上海一、华东-上海二、华南-广州示例：www.example.com	准备自定义域名涉及域名注册费用，由域名注册商收取，具体费用以实际为准。
DNS	OBS桶绑定的自定义域名需要在DNS上配置CNAME记录。	免费

本例中，静态网站文件的示例如下：

index.html的内容为：

<html>
  <head>
      <title>Hello OBS!</title>
      <meta charset="utf-8">
  </head>
  <body>
      <p>欢迎使用OBS静态网站托管功能</p>
      <p>这是首页</p>
  </body>
</html>

error.html的内容为：

<html>
  <head>
      <title>Hello OBS!</title>
      <meta charset="utf-8">
  </head>
  <body>
      <p>欢迎使用OBS静态网站托管功能</p>
      <p>这是404错误页面</p>
  </body>
</html>

操作流程

您需要先在OBS管理控制台上创建一个桶，用于存放静态网站资源，并启用该桶的静态网站托管，然后通过OBS提供的绑定自定义域名功能，将自定义域名与新创建的桶绑定，再通过云解析服务（Domain Name Service，DNS）创建和配置域名托管，实现自定义域名访问托管在OBS上的静态网站。具体操作流程如下：

图2 使用自定义域名托管静态网站流程图

准备工作

包含以下准备工作：

注册域名

如果您拥有一个已注册的域名，可跳过本步骤。

如果您还没有，请选择一个合适的注册商注册一个属于自己企业的域名。在本场景下，以数据规划中的示例域名www.example.com进行注册，在实际操作中，您需要将此域名替换为您自己规划的域名。

创建桶

桶名没有特殊要求，您只需要按照界面提示的命名规则创建一个桶用于存储静态网站文件。此处以创建一个桶名称为example的桶为例，其具体操作步骤如下：

打开OBS管理控制台，根据页面提示进行登录。
在页面上方单击“创建桶”。
在弹出的对话框中配置以下参数。
- 区域：根据就近原则选择离业务较近的区域。
- 默认存储类别：推荐选择“标准存储”。
  
  您也可以根据网站的访问频率以及对响应速度的要求，选择“低频访问存储”或“归档存储”。存储类别详情介绍请参见桶存储类别简介。
- 桶名称：输入“example”。
- 桶策略：选择“公共读”使桶内对象能够被任何用户访问。
- 服务端加密：选择“不开启加密”。
- 企业项目：请先创建企业项目，默认为default企业项目，然后在创建桶时选择对应企业项目。仅企业账号能够配置企业项目。
单击“立即创建”，完成桶创建。

上传静态网站文件

整理好待上传的静态网站文件，在OBS控制台重复执行以下步骤，直至所有的静态网站文件都上传至准备工作创建的桶中。

在支持批量上传的区域，OBS控制台每次最多支持100个文件同时上传，总大小不超过5GB，如果网站文件较多，建议使用OBS Browser+上传，具体操作步骤请参见使用OBS Browser+上传文件或文件夹。

单击待操作的桶名称，进入桶对象页面。
单击“上传对象”，系统将弹出如下所示对话框。

图3 上传对象
添加待上传的文件。
- 不可加密上传静态网站文件。
- 存储类别建议选择“标准”。如果静态网站文件的存储类别为“归档存储”，则需要先恢复才能被访问，具体恢复步骤请参见恢复归档存储文件。
- 网站首页文件（index.html）和404错误页面（error.html），需要存放在桶的根目录下。
单击“上传”完成文件上传。

配置静态网站托管

上传完静态网站文件后，您需要执行以下步骤，将当前桶设置为静态网站托管模式。

您也可以将整个静态网站直接重定向至另一个桶或域名，配置操作请参见重定向请求。

单击桶名称，进入桶对象页面后单击“数据管理 > 静态网站托管”。
单击“配置静态网站托管”按钮。
在弹出的对话框中，开启静态网站托管并选择“配置到当前桶”，将“默认首页”配置为数据规划中的index.html，将“默认404错误页面”配置为数据规划中的error.html，如下所示。

图4 配置静态网站托管

您也可以根据业务需求配置重定向规则，实现网站内容重定向，具体操作请参见配置静态网站托管。
单击“确定”。

配置自定义域名

单击桶名称进入“对象”页面，在左侧导航栏选择“域名管理”。
单击页面上方的“配置自定义域名”，如果没有绑定自定义域名也可以在页面下方的配置自定义域名卡片中单击“配置自定义域名”，在“用户域名”输入“www.example.com”，如下所示。

图5 配置自定义域名
单击“确定”。
根据页面提示，支持单击“一键解析”，或手动完成解析CNAME，单击右下角的“我已了解”。

华为云域名支持一键解析添加CNAME记录；非华为云域名不支持一键解析，请用户自行配置解析规则。

创建和配置域名托管

为了方便对您的自定义域名和静态网站统一管理，实现业务全面云化，您可以直接在华为云提供的云解析服务（Domain Name Service，DNS）上托管您的自定义域名。托管完成后，后续域名解析的管理都可以在云解析服务上进行，包括：管理记录集、管理反向解析、设置域名泛解析等等。

您也可以直接在域名注册商域名解析中添加一条别名记录，指向桶的访问域名。例如：桶“www.example.com”所处区域“中国-香港”，则需要在域名注册商添加一条值为“www.example.com CNAME www.example.com.obs-website.ap-southeast-1.myhuaweicloud.com”的记录。

使用云解析服务创建和配置域名托管的操作步骤如下：

创建公网域名。

在云解析服务中创建公网域名，使用准备工作中注册的根域名“example.com”作为创建公网域名。详细的创建方法请参见配置网站解析章节中的“添加域名”部分内容。
添加别名记录。

在云解析服务中为托管域名子域名“www.example.com”添加记录集，配置该子域名别名指向OBS的静态网站托管域名。在添加别名记录时参数配置如下：
- 主机记录：输入“www”。
- 类型：选择“CNAME – 将域名指向另外一个域名”。
- 线路类型：选择“全网默认”。
- TTL(秒)：保持默认。
- 值：需指向的域名。如果绑定自定义域名时没有开启CDN加速，此处填写OBS的桶的静态网站托管域名；如果开启了CDN加速，此处填写CDN提供的加速域名（即CNAME）。
详细的创建方法请参见增加CNAME类型记录集。
在域名注册商处修改域名解析服务器地址。

在域名注册商处，将该根域名对应的NS记录中域名解析服务器地址修改为云解析服务（DNS）服务器的地址，具体地址为云解析服务中该公网域名记录集中NS记录的值字段内容信息。

详细的更改域名解析服务器地址的方法请参见配置网站解析章节中的“更改域名的DNS服务器”部分。

更改后的域名解析服务器地址将于48小时内生效，具体生效时间请以域名注册商处的说明为准。

验证

在浏览器中输入访问地址：www.example.com，验证能否访问到配置的默认首页，如图6所示。
图6 默认首页
在浏览器中输入一个桶中不存在的静态文件访问地址，例如：www.example.com/imgs，验证能否访问到配置的404错误页面，如图7所示。
图7 404错误页面

由于浏览器缓存等原因，您可能需要清除浏览器缓存后才能查看到预期效果。

（后续操作）更新静态网站

后续如果需要对网站某个静态文件（如：图片、音乐、html文件、css文件等）进行更新，您可以重新上传该静态文件。但需要注意的是，默认情况下，在OBS同一路径下新上传的文件会覆盖OBS上已存在的同名文件。为避免文件覆盖的情况，您可以选择启用OBS的多版本控制功能。利用多版本控制，可以保留静态文件的多个版本，使您更方便地检索和还原各个版本，在意外操作或应用程序故障时快速恢复数据。

启用多版本控制

登录OBS管理控制台。
在桶列表中单击待操作的桶，进入桶对象页面后在左侧导航栏单击“概览”。
在“基础配置”区域下，单击“多版本控制”卡片，系统弹出多版本控制对话框。

图8 多版本控制
勾选“启用”后单击“确定”，启用目标桶中对象的多版本控制。

关于多版本控制的更多介绍以及操作指导，请参见多版本控制。

更新静态文件

登录OBS管理控制台。
在桶列表中单击待操作的桶，进入对象页面。
单击“上传对象”，或选择待更新文件所在文件夹后单击“上传对象”。

图9 上传对象
添加待上传文件。
- 不可加密上传静态网站文件。
- 存储类别建议选择“标准”。如果静态网站文件的存储类别为“归档存储”，则需要先恢复才能被访问，具体恢复步骤请参见恢复归档存储文件。
单击“上传”完成文件上传。

在同一路径下新上传的同名文件会作为“最新版本”显示在对象列表，每次访问此文件时，都是访问的此文件的最新版本，以此达到更新静态网站文件的效果。