OSS如何实现静态网站托管?
用户可以基于OSS搭建一个静态网站。本文介绍了如何从申请域名开始，基于OSS搭建一个简单的静态网站。主要的步骤是：
- 申请一个域名。
- 开通OSS并创建Bucket。
- 开通OSS的静态网站托管功能。
- 使用自定义域名访问OSS。
最后本文会介绍一些常见的问题。
静态网站托管功能介绍
简单说就是用户可以基于OSS搭建一个简单的静态网页。用户开启此功能后，OSS提供了一个默认的首页和默认的404页面功能。具体参见开发人员指南中 静态网站托管的介绍。
具体实现步骤
步骤一：申请域名
本文的域名是从万网购买的，申请了一个leo23.xyz的域名。如果需要更多域名方面的帮助，请参见 http://wanwang.aliyun.com/
步骤二：开通OSS并创建Bucket
登录OSS控制台，创建一个Bucket为imgleo23，创建在上海，Endpoint为oss-cn-shanghai.aliyuncs.com。操作步骤请参见 创建存储空间。
将Bucket的权限设置为公共读。操作步骤请参见 设置存储空间读写权限。
上传index.html、error.html、aliyun-logo.png 文件。操作步骤请参见 上传文件。
index.html 的内容为：[backcolor=transparent]<html>- [backcolor=transparent] [backcolor=transparent]<head>
- [backcolor=transparent] [backcolor=transparent]<title>[backcolor=transparent]Hello OSS![backcolor=transparent]</title>
- [backcolor=transparent] [backcolor=transparent]<meta[backcolor=transparent] [backcolor=transparent]charset[backcolor=transparent]=[backcolor=transparent]"utf-8"[backcolor=transparent]>
- [backcolor=transparent] [backcolor=transparent]</head>
- [backcolor=transparent] [backcolor=transparent]<body>
- [backcolor=transparent] [backcolor=transparent]<p>[backcolor=transparent]欢迎使用OSS静态网站的功能[backcolor=transparent]</p>
- [backcolor=transparent] [backcolor=transparent]<p>[backcolor=transparent]这是首页[backcolor=transparent]</p>
- [backcolor=transparent] [backcolor=transparent]</body>
- [backcolor=transparent]</html>
error.html 的内容为：
- [backcolor=transparent] <html>
- [backcolor=transparent] [backcolor=transparent]<head>
- [backcolor=transparent] [backcolor=transparent]<title>[backcolor=transparent]Hello OSS![backcolor=transparent]</title>
- [backcolor=transparent] [backcolor=transparent]<meta[backcolor=transparent] [backcolor=transparent]charset[backcolor=transparent]=[backcolor=transparent]"utf-8"[backcolor=transparent]>
- [backcolor=transparent] [backcolor=transparent]</head>
- [backcolor=transparent] [backcolor=transparent]<body>
- [backcolor=transparent] [backcolor=transparent]<p>[backcolor=transparent]这是OSS静态网站托管的错误首页[backcolor=transparent]</p>
- [backcolor=transparent] [backcolor=transparent]</body>
- [backcolor=transparent]</html>
aliyun-logo.png 是一张图片。
步骤三：开通OSS的静态网站托管功能
如下图所示，登录控制台后，将 [backcolor=transparent]默认首页 设置为上文中的 [backcolor=transparent]index.html，将 [backcolor=transparent]默认404页 设置为上文中的 [backcolor=transparent]error.html。具体操作请参见 设置静态网站托管。
检验静态网站托管功能，输入如图所示的URL地址：
显示默认的首页
可以看到输入类似URL的时候，会显示开通时指定的index.html中的内容。
显示默认的404页
可以看到输入的URL没有对应的文件时，会显示开通时指定的error.html中的内容。
显示正常的文件
可以看到输入的URL有对应的文件时，会读取成功。
这里可能会出现一个问题，就是用户发现实际使用中，浏览器的行为是下载，而不是直接在浏览器上展示。这是OSS的行为。与用户无关。如果需要在浏览器中直接显示，需要用户用自定义域名的方式来使用静态网站功能。
步骤四：使用自定义域名访问 OSS
开发人员指南中的 自定义域名访问 OSS有介绍如何实现自定义域名访问 OSS，这里不多说。直接来看最后的效果。
显示默认的首页
显示默认的404页
显示正常的文件
这样一个简单的静态网站就实现了。
常见问题及解决方案
为什么我设置的静态网站托管网页是直接下载的？静态html网页通过url访问为下载不是浏览？怎么解决？
由于国内互联网访问的备案制度，OSS默认的行为会变成下载。这个时候需要用户改用 自定义域名访问 OSS。
OSS静态网站托管对客户来说有什么好处?
在用户需求比较简单的时候，且访问量比较小的时候，可以省掉一台ECS。如果访问量大一点，可以考虑结合CDN来使用。
价格怎么样？如何和CDN结合？
价格可以参考官方网站OSS的价格，CDN的价格也可以参考官方网站CND的价格，官网地址 www.aliyun.com。和CDN结合的例子可以参考 CDN加速OSS实践。
默认的首页和默认的404页面都需要设置吗？
默认首页需要设置，但默认404页面可以不用设置。
为什么输入的URL在浏览器上返回403？
有可能Bucket的权限不是公开读。也有可能是因为欠费被停止使用。
展开
收起
5
条回答
写回答
写回答
-
-
-
-
-
函数计算开发工程师ReOSS如何实现静态网站托管Hi，请问存在oss上的html可以解析同存在oss里的js文件作为样式吗2017-12-15 17:18:46赞同 展开评论 打赏
问答标签：
版权声明：本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
相关问答
