想要搭建纯静态网站,最优的选择无疑是对象存储服务。

简介

大部分IDC商家都有提供对象存储服务,国内的比如阿里云、腾讯云、华为云、七牛云等,国外有亚马逊、谷歌、微软等。

海量、安全、低成本、高可靠的云存储服务,提供99.9999999999%的数据可靠性。使用RESTful API可以在互联网任何位置存储和访问,容量和处理能力弹性扩展,多种存储类型供选择全面优化存储成本。这是阿里云对其对象存储(OSS)服务的描述。
(阿里云写的这段话,其实我也没看懂多少)

简单来说,对象存储服务可以用于储存文件,并且提供上传和下载接口,方便开发者用其来储存云文件。同时也支持直接通过域名访问,所以我们可以用来搭建静态网站
仅仅是搭建静态网站,对象存储无疑是最优的选择。购买云虚拟主机或者云服务器大大增加了成本,因为我们仅仅是静态网站,不需要那么多功能。而且使用对象存储操作简单方便访问速度快可以绑定自定义域名,是专门用于这项功能的。
本文章通过阿里云的服务来介绍如何使用对象存储搭建静态网站。其他商家的配置方法大同小异。

本文使用阿里云为例。另外腾讯云的对象存储提供10G免费月流量和50G免费储存空间,但我更喜欢阿里云一点,而且那点储存及流量费用非常便宜。

名词释义

这里对一些专有名词做出简单的解释方便理解。
对象存储:就是用来储存文件的服务。
Bucket:桶,也就是储存空间,可以简单的理解为存放网站文件的空间。
存储空间:存储文件所需要的空间。
访问流量:访问文件产生的流量,由被访问文件大小决定。
外网访问:从局域网外部访问文件。
请求费用:请求文件产生的费用。

开始

前往阿里云官网,注册登录账号等不再赘述了,进入控制台,来到对象存储的控制台。
阿里云OSS控制台
如上图所示就是阿里云对象存储控制台了,因为我已经创建过Bucket(存储空间)所以跟大家显示的可能不太一样。

计费标准

存储空间费用(标准类型):0.12元/GB/月
访问流量费用(外网访问):闲时:0.25元/GB,忙时:0.50元/GB
请求费用(所有类型):0.01元/万次

此为国内存储空间按量付费计费标准,海外地域会有略微调整。小型站点建议使用按量付费,大型站点建议购买流量包套餐。点击这里查看详情。

创建Bucket

Bucket就是存储空间。点击左边Bucket列表上的加号或者右边的“创建Bucket”按钮即可创建。
创建Bucket
Bucket名称:这个不能和其他用户的重复所以建议在前面加上自己的id为前缀以免提示名称被占用,比如咱这个pplin-test~
区域:这个按照自己的需求选择即可,如果你的域名没有备案则必须选择海外地域,建议香港
存储类型:我们搭建静态网站,选择标准储存即可。
读写类型:必须选择公共读,不然别人怎么访问进来呢~
其他参数按照默认的即可,不需要更改,除非你有特殊需求。

Bucket 创建成功后,您所选择的存储类型、区域不支持变更。
填写完毕后单击确定按钮即可完成创建。

创建Bucket成功
页面还提供了“访问域名”,值得关注的是“外网访问”的“Bucket 域名”,这是OSS提供的默认域名,比如我的是pplin-test.oss-cn-shenzhen.aliyuncs.com,这里需要留意一下待会会用到

上传文件

在列表中选中Bucket后,单击上方的“文件管理”,使用这个很简单方便的文件管理即可完成文件的上传。上传我们的网页文件。
比如我上传个index.html
上传文件
上传操作不再赘述,这是傻瓜式操作了。

这个文件管理器依然存在局限性,如果您的网站的目录结构较为复杂,上传后将会丢失目录结构,请使用ossbrowser,这是阿里云OSS提供的客户端,操作文件更加方便且全面。

搭建网站

文件上传好了,现在让这个Bucket可以直接通过浏览器访问。
单击上方的“基础设置”,往下滑找到“静态页面”,将“默认首页”选项内容修改为index.html
当然这个文件名可以根据您的需要进行修改,总之必须要填写一个文件名。
默认404页选项选填,根据自己的需求选择。
搭建网站
这时我们访问OSS提供的默认域名(比如我的是pplin-test.oss-cn-shenzhen.aliyuncs.com),发现有反应但是是直接将文件下载下来了,这显然不是我们想要的效果。

针对中国大陆、香港地区的 OSS,如果直接使用OSS默认域名从互联网访问OSS上网页类型文件,Response Header中会自动加上Content-Disposition:'attachment=filename;'。即从浏览器访问网页类型文件时,会以附件形式进行下载。

所以说如果我们的Bucket在中国大陆以及香港,需要绑定自定义域名才能达到我们想要的效果。

绑定自定义域名

终于到了关键时刻。
点击上方的“域名管理”,单击“绑定用户域名”,填写我们要绑定的域名。
然后需要修改域名解析,记录类型为CNAME,记录值为OSS默认域名(比如我的是pplin-test.oss-cn-shenzhen.aliyuncs.com)。
修改域名解析需要前往域名DNS服务提供商修改,详细内容不再赘述。假如您的域名使用的阿里云DNS,还支持自动修改解析值,不需要我们亲自动手。
绑定域名
待解析生效后,访问我们的自定义域名,大功告成!~
效果展示

HTTPS设置

虽然说网站已经成功的搭建完毕了,但HTTPS是目前的主流,且可以提高安全性,推荐配置SSL证书以启用HTTPS。
当然,这不是必须的。

在“域名管理”的列表中,可以看到“HTTPS 证书”这一列显示“未上传”,说明该域名还没有配置SSL证书。
单击域名这一行右边的“证书托管”链接,弹出证书设置页面。
.pem文件格式证书内容复制进第一个框中,将.key文件格式证书内容复制进第二个框中。
若下载证书提示”服务器类型选择证书”,啧选择NGINX即可。
如果您没有SSL证书,单击“申请签发证书”即可获取免费的SSL证书。
证书上传

证书上传完毕后使用HTTPS访问,证书安全有效。
效果

CDN加速访问

这里使用CDN的目的主要是加速访问速度,毕竟我们是静态网站,全部缓存到CDN上面也不是不可以,对于静态资源来说简直是Awesome!

这也不是必须的。

CDN具体的定义请查询百度,这里简单说下。IDC商家部署很多CDN节点,会将我们的静态网站资源缓存到各个CDN节点上,访客可以就近寻找CDN节点来获取资源内容,从而整体提升访问速度。

使用本功能,域名需要备案。当然并不是说只有备案才能使用CDN服务,只是本文介绍的是国内CDN,所以必须要备案才能使用国内CDN。

配套服务,本文使用阿里云CDN作为例子。
在“域名管理”的列表中,可以看到“阿里云 CDN 加速”这一列显示“未配置”,说明该域名还没有配置阿里云CDN服务。单击“未配置”即可跳转到CDN设置页面。
配置信息他会默认帮我们选择好,不需要多费心。
设置阿里云CDN
设置阿里云CDN
返回CDN域名列表,配置速度不会那么快,等配置完毕后会出现CNAME地址。
然后更改域名解析,CNAME,解析值为CDN域名列表提供的CNAME值。
设置阿里云CDN
待域名解析生效,代表CDN配置成功了。
还可以根据自己的需求继续配置CDN策略已达到最佳效果。

请注意:假如之前给OSS自定义域名配置了HTTPS证书,那么挂上CDN后需要在CDN控制台重新配置HTTPS证书
如下图所示配置
设置阿里云CDN
设置阿里云CDN

总结

总体来说,这个配置过程并不是很困难。对象存储可以用于很多方面,搭建静态网站只是其中的一部分。低廉的价格和高速的访问大大的提升了体验效果。还是值得一试的~