文档首页/ 对象存储服务 OBS/ 最佳实践/
更新时间：2024-11-26 GMT+08:00
分享

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

应用场景

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

方案架构

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

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

方案优势

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

资源和成本规划

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

表1 资源和成本规划说明

资源

资源说明

成本说明

OBS

需要创建一个OBS桶用于存放静态网站文件，同时在OBS桶上完成静态网站托管配置和自定义域名绑定。

OBS的使用涉及以下几项费用：

  • 存储费用：静态网站文件存储在OBS中产生的存储费用。
  • 请求费用：用户访问OBS中存储的静态网站文件时产生的请求费用。
  • 流量费用：用户使用自定义域名通过公网访问OBS时产生的流量费用。

实际产生的费用与存储的文件大小、用户访问所产生的请求次数和流量大小有关，请根据自己的业务进行预估。

静态网站文件
  • 静态网站首页：

    访问静态网站时返回的索引页面，即首页。

    示例：index.html

  • 404错误页面：

    当访问错误的静态网站路径时，返回的404错误页面。

    示例：error.html

免费

自定义域名

用户自己的域名地址，需要绑定在OBS桶上。

按照工信部要求，您绑定自定义域名的桶如果在以下区域，需要提前完成ICP备案。

包括：华北-北京一、华北-北京四、华北-乌兰察布一、华东-上海一、华东-上海二、华南-广州、西南-贵阳一

示例：www.example.com

准备自定义域名涉及域名注册费用，由域名注册商收取，具体费用以实际为准。

CDN

可选。可以为OBS桶绑定的自定义域名开启CDN加速，以实现更快的资源访问速度。

使用CDN加速会产生相应的流量费用，具体请参见CDN加速OBS计费规则。

实际产生的费用与用户访问所产生的流量大小有关，请根据自己的业务进行预估。

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的桶为例，其具体操作步骤如下：

  1. 打开OBS管理控制台，根据页面提示进行登录。
  2. 在页面右上角单击“创建桶”。
  3. 在弹出的对话框中配置以下参数。

    • 区域：根据就近原则选择离业务较近的区域。
    • 默认存储类别：推荐选择“标准存储”。

      您也可以根据网站的访问频率以及对响应速度的要求，选择“低频访问存储”或“归档存储”。存储类别详细介绍请参见桶存储类别简介。

    • 桶名称：输入“example”。
    • 桶策略：选择“公共读”使桶内对象能够被任何用户访问。
    • 服务端加密：选择“不开启加密”。
    • 企业项目：请先创建企业项目，默认为default企业项目，然后在创建桶时选择对应企业项目。仅企业账号能够配置企业项目。

  4. 单击“立即创建”，完成桶创建。

上传静态网站文件

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

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

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

    图3 上传对象

  3. 添加待上传的文件。

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

  4. 单击“上传”完成文件上传。

配置静态网站托管

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

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

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

    图4 配置静态网站托管

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

  4. 单击“确定”。

配置自定义域名

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

    图5 配置自定义域名

  3. 单击“确定”。
  4. 根据页面提示，支持单击“一键解析”，或手动完成解析CNAME，单击右下角的“我已了解”，如图6所示。

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

    图6 解析CNAME

  5. （可选）配置CDN加速。

    CDN加速需收费，具体请参见CDN价格说明。

    1. 在已绑定的自定义域名操作列，单击“开启加速”。
    2. 根据您的业务情况选取对应的“服务范围”和“业务类型”。
    3. 在“其他信息”栏目，勾选开启静态网站托管。

    4. 单击“确定加速”。

  6. （可选）如果开启了CDN加速，需要按照以下步骤配置CDN加速。

    1. 在已绑定的自定义域名操作列，单击“管理CDN加速”。
    2. 在打开的CDN控制台页面，单击域名，然后再单击“高级配置”，进入域名高级配置页面。
    3. 在“高级配置”中的“HTTP header配置”中，添加“Content-Disposition”响应头，取值为“inline”。

配置加速域名

  1. 单击桶名称进入“对象”页面，在左侧导航栏选择“域名管理”。
  2. 单击页面上方的“配置加速域名”，弹出“配置加速域名”页面，如图7所示。

    图7 配置加速域名

  3. 选择“服务范围”，选择“业务类型”，设置“加速域名”，单击“确定加速”。
  4. 根据页面提示，支持单击“一键解析”，或手动完成解析CNAME，单击右下角的“我已了解”，如图8所示。

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

    图8 解析CNAME

  5. 支持使用“自动刷新缓存”功能，如图9所示，在域名管理列表，找到需要创建自动刷新缓存的域名卡片，在“自动刷新缓存”的右侧单击“配置”，单击开启“自动刷新缓存”开关，出现配置页面。

    图9 配置自动刷新缓存

  6. 配置自动刷新策略参数，完成后单击“确定配置”。

    表2 事件触发器参数说明

    参数

    说明

    事件

    自动刷新策略生效的事件类型。目前，OBS支持以下事件类型：

    • ObjectCreated：表示所有创建对象的操作，包含Put、Post、Copy对象以及合并段。
    • Put：Put上传对象事件。
    • Post：Post上传对象事件。
    • Copy：使用Copy方法复制对象事件。
    • CompleteMultipartUpload：表示合并分段任务。
    • ObjectRemoved：表示删除对象的操作。
    • Delete：删除对象事件。

    前缀

    自动刷新策略生效对象的前缀。

    说明：

    当前不支持目录刷新，前缀不能以“/”结尾。

    后缀

    自动刷新策略生效对象的后缀。

    说明：

    当前不支持目录刷新，后缀不能以“/”结尾。

    IAM委托

    在使用OBS的部分特性时，需要使用IAM委托功能给OBS授予相关的权限，以委托OBS处理您的数据。

  7. 如果开启了CDN加速，需要按照以下步骤配置CDN源站信息。

    1. 在已绑定的自定义域名操作列，单击“管理CDN加速”。
    2. 在打开的CDN控制台页面，单击域名，进入域名基本配置页面。
    3. 在“源站配置”区域单击“编辑”按钮，在弹出的“修改源站信息”弹框中，勾选“静态网站托管”。
    4. 单击“确定”。
    5. 在“高级配置”中添加“Content-Disposition”响应头，取值为“inline”。

    使能CDN加速后，根据托管的静态网站类型选择网站加速、文件下载加速或点播加速。CDN加速需收费，具体请参见CDN价格说明。

创建和配置域名托管

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

您也可以直接在域名注册商域名解析中，根据是否开启CDN加速来添加一条别名记录。

  • 如果绑定自定义域名时开启了CDN加速，则添加的别名记录需指向CDN提供的加速域名。例如：域名“www.example.com”开启CDN加速后的加速域名为“www.example.com.c.cdnhwc1.com”，则需要在域名注册商添加一条值为“www.example.com CNAME www.example.com.c.cdnhwc1.com”的记录。
  • 如果绑定自定义域名时未开启CDN加速，则添加的别名记录需指向桶的访问域名。例如：桶“example”所处区域“华北-北京一”，则需要在域名注册商添加一条值为“www.example.com CNAME example.obs.cn-north-1.myhuaweicloud.com”的记录。

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

  1. 创建公网域名。

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

  2. 添加别名记录。

    在云解析服务中为托管域名子域名“www.example.com”添加记录集，配置该子域名别名指向OBS的静态网站托管域名。在添加别名记录时参数配置如下：

    • 主机记录：输入“www”。
    • 记录类型：选择“CNAME – 将域名指向另外一个域名”。
    • 线路类型：选择“全网默认”。
    • TTL(秒)：保持默认。
    • 记录值：需指向的域名。如果绑定自定义域名时没有开启CDN加速，此处填写OBS的桶的静态网站托管域名；如果开启了CDN加速，此处填写CDN提供的加速域名（即CNAME）。

    详细的创建方法请参见增加CNAME类型记录集。

  3. 在域名注册商处修改域名解析服务器地址。

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

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

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

验证

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

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

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

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

启用多版本控制

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

    图12 多版本控制

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

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

更新静态文件

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

    图13 上传对象

  4. 添加待上传文件。

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

  5. 单击“上传”完成文件上传。

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

父主题： OBS域名管理

相关文档