一、Cloudzyro 是什么
Cloudzyro 是一个可以在线部署网站和应用的托管平台,官网免费入口:
https://cloudzyro.com/deploy/free
免费档叫 Launch,新站点默认就是这个套餐,不用手动选。实测全程没有要求绑卡、手机号、身份证验证。
二、免费档实测规格
以下全部是控制台 Billing 页面核对过的实际数值:
- 价格:0,Billing 明确写着“Next payment 0”,没有发票记录,也没有绑卡入口
- CPU:1 核
- 内存:512MB
- 流量:每月 100GB
- 单文件上传上限:100MB
- 可恢复版本:5 个
- 免费自定义域名:包含
- 超流量不断线:超过流量后只会被降速,永不下线、永不收费、没有超额账单
三、注册步骤
1. 打开免费入口
打开 https://cloudzyro.com/deploy/free ,点注册。
2. 建议直接用 Google 登录
实测中邮箱注册的确认链接两次都失效了:刚收到新邮件、立刻打开就报链接无效。改走“Sign in with Google”一次就进去了。
注意:Google 账号如果开了两步验证,登录时要在手机 Gmail 应用里点两次确认(实测中页面数字先是 45,刷新后变成 66,两次都要点),按页面显示的数字点就行。
3. 填欢迎设置页
登录成功后会出现一次性的欢迎设置页,三个字段这样填:
- Your name:填你的用户名,比如 xiaoyao
- Workspace name:保持默认的 Personal Workspace 不动
- Console address:填你的用户名,比如 xiaoyao
注意:Console address 填完永久不可更改,只能用字母、数字和连字符,填之前想好。
填完就进入控制台首页,地址是 https://console.cloudzyro.com/xiaoyao (xiaoyao 换成你自己的控制台地址)。
四、部署第一个网站
1. 新建站点
在控制台新建一个站点,系统会先给一个随机名字的空站(实测建了一个叫 rosy-heron-10 的空站)。只建壳、不传文件的话,站点状态是 Not live yet,还不能访问。
2. 用 Cloudzyro Agent 一键生成
控制台里有 Cloudzyro Agent,选 Build 模式,描述你想要的网站,让它生成一个单页静态站。首次构建免费,每天还有一定免费额度,具体数量以控制台显示为准。
3. 发布上线
生成完成后点发布。发布前会提示几项 SEO 建议(页面标题、描述、sitemap),不影响上线,直接选 Publish anyway 就行。控制台显示“Version 1 is live”就是上线了。
实测生成的演示站已经可以公开打开:
https://very-simple-static-demo-website-one.cloudzyro.app/
五、实测结论与注意事项
- 免费档 $0、免绑卡实测走通,可以直接用。
- 超流量只降速不扣费,这点在控制台白纸黑字写着。
- 自定义域名在套餐对照表里写着包含,但本文没有实际绑定测试,绑定流程以控制台实际操作为准。
- 以下两点官网文档已写明,可以放心讲:站点永不休眠(免费档也一样),免费档没有时间限制。
- 还没核实:免费档能建几个站点。
- 存储要特别注意:Cloudzyro 的站点没有永久硬盘,每版本上传上限 100MB、最多 2 万个文件,运行中产生的文件每次部署或恢复都会清空。所以它不适合当图床,图片、上传类文件官方建议放 Supabase Storage 这类对象存储。
六、附录:演示站完整代码(晨光咖啡)
下面是本文第四节部署的演示站完整代码,保存为 index.html 就能用。部署方法二选一:
- 方法一(实测走通):在控制台新建站点后打开 Cloudzyro Agent,把下面整段代码原样粘贴给它,让它按这份代码建站并发布。
- 方法二:把 index.html 打包成 zip 再上传。注意:实测中 zip 入口报过“We couldn't open this zip file”,单个文件上传也被界面忽略过,如果上传失败就改用方法一。
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>晨光咖啡 Morning Light · 社区咖啡馆</title>
<meta name="description" content="晨光咖啡是一家社区咖啡馆,现磨手冲、手工烘焙,每天早上七点开门。">
<style>
* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: -apple-system, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif; color: #2b2118; background: #faf6f0; line-height: 1.7; }
a { color: inherit; text-decoration: none; }
.wrap { max-width: 1080px; margin: 0 auto; padding: 0 24px; }
/* 导航 */
header { position: sticky; top: 0; z-index: 10; background: rgba(250, 246, 240, .92); backdrop-filter: blur(8px); border-bottom: 1px solid #eadfce; }
nav { max-width: 1080px; margin: 0 auto; padding: 14px 24px; display: flex; align-items: center; justify-content: space-between; }
.logo { font-size: 20px; font-weight: 800; letter-spacing: 2px; }
.logo span { color: #b4713a; }
nav ul { list-style: none; display: flex; gap: 28px; font-size: 15px; }
nav ul a:hover { color: #b4713a; }
.nav-cta { background: #2b2118; color: #faf6f0; padding: 8px 18px; border-radius: 999px; font-size: 14px; }
/* Hero */
.hero { background: linear-gradient(135deg, #f3e2c7 0%, #ecd3ac 45%, #dfb98a 100%); border-radius: 0 0 32px 32px; }
.hero-inner { max-width: 1080px; margin: 0 auto; padding: 88px 24px 96px; }
.hero-tag { display: inline-block; background: #fff; color: #b4713a; font-size: 13px; font-weight: 700; letter-spacing: 2px; padding: 6px 14px; border-radius: 999px; margin-bottom: 20px; }
.hero h1 { font-size: clamp(34px, 6vw, 58px); line-height: 1.25; letter-spacing: 2px; }
.hero p { margin: 20px 0 32px; font-size: 17px; color: #5d4a36; max-width: 560px; }
.btn { display: inline-block; padding: 13px 30px; border-radius: 999px; font-size: 16px; font-weight: 700; }
.btn-dark { background: #2b2118; color: #faf6f0; }
.btn-light { background: #fff; color: #2b2118; margin-left: 12px; }
/* 通用区块 */
section { padding: 72px 0; }
.sec-title { font-size: 28px; letter-spacing: 2px; margin-bottom: 8px; }
.sec-sub { color: #8a7360; margin-bottom: 36px; }
/* 特色卡片 */
.cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.card { background: #fff; border: 1px solid #eadfce; border-radius: 20px; padding: 28px 24px; }
.card .icon { width: 52px; height: 52px; border-radius: 16px; display: flex; align-items: center; justify-content: center; font-size: 26px; margin-bottom: 16px; }
.card h3 { font-size: 18px; margin-bottom: 8px; }
.card p { font-size: 15px; color: #6b5a48; }
.i1 { background: #f6e3c8; } .i2 { background: #e4edda; } .i3 { background: #fbe4dc; }
/* 菜单 */
.menu { background: #fff; border-top: 1px solid #eadfce; border-bottom: 1px solid #eadfce; }
.menu-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.dish { border: 1px solid #eadfce; border-radius: 20px; overflow: hidden; background: #faf6f0; }
.dish-img { height: 150px; display: flex; align-items: center; justify-content: center; font-size: 56px; }
.d1 { background: linear-gradient(135deg, #e8c99a, #c98f4e); }
.d2 { background: linear-gradient(135deg, #d9e2c4, #a9bd7f); }
.d3 { background: linear-gradient(135deg, #f2d3c4, #dd9a7b); }
.d4 { background: linear-gradient(135deg, #e3d3f2, #b394d4); }
.d5 { background: linear-gradient(135deg, #f7e8b8, #e0b93c); }
.d6 { background: linear-gradient(135deg, #cfe3f2, #7ba7cc); }
.dish-body { padding: 20px 22px 24px; }
.dish-body h3 { font-size: 17px; display: flex; justify-content: space-between; }
.dish-body h3 b { color: #b4713a; }
.dish-body p { font-size: 14px; color: #6b5a48; margin-top: 6px; }
/* 数据条 */
.stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; text-align: center; }
.stat b { display: block; font-size: 34px; color: #b4713a; }
.stat span { font-size: 14px; color: #8a7360; }
/* 评价 */
.reviews { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.review { background: #fff; border: 1px solid #eadfce; border-radius: 20px; padding: 26px; }
.review p { font-size: 15px; color: #4d3f31; }
.review footer { margin-top: 14px; font-size: 14px; color: #8a7360; }
.stars { color: #d99a2b; letter-spacing: 2px; }
/* 信息 */
.info { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.info-box { background: #2b2118; color: #f3e9db; border-radius: 20px; padding: 28px 24px; }
.info-box h3 { font-size: 17px; margin-bottom: 10px; color: #f0c98f; }
.info-box p { font-size: 15px; color: #d8c9b8; }
footer { text-align: center; color: #8a7360; font-size: 14px; padding: 36px 0 48px; }
@media (max-width: 720px) {
.cards, .menu-grid, .reviews, .info { grid-template-columns: 1fr; }
.stats { grid-template-columns: repeat(2, 1fr); }
nav ul { display: none; }
section { padding: 52px 0; }
}
</style>
</head>
<body>
<header>
<nav>
<a class="logo" href="#">晨光咖啡 <span>Morning Light</span></a>
<ul>
<li><a href="#features">我们的坚持</a></li>
<li><a href="#menu">菜单</a></li>
<li><a href="#reviews">客人怎么说</a></li>
<li><a href="#visit">来店里</a></li>
</ul>
<a class="nav-cta" href="#visit">今日营业中</a>
</nav>
</header>
<div class="hero">
<div class="hero-inner">
<span class="hero-tag">社区咖啡馆 · 每天 7:00 开门</span>
<h1>一杯现磨咖啡,<br>开启普通却美好的一天。</h1>
<p>我们用每周新鲜烘焙的豆子、每天现做的面包,在街角给你留一个可以坐下来慢慢喝咖啡的位置。</p>
<a class="btn btn-dark" href="#menu">看看今天的菜单</a>
<a class="btn btn-light" href="#visit">找到我们</a>
</div>
</div>
<section id="features">
<div class="wrap">
<h2 class="sec-title">我们的坚持</h2>
<p class="sec-sub">三件小事,每天重复做。</p>
<div class="cards">
<div class="card">
<div class="icon i1">☕</div>
<h3>每周新鲜烘焙</h3>
<p>豆子每周小批量烘焙,标注烘焙日期,超过两周的豆子不用来做手冲。</p>
</div>
<div class="card">
<div class="icon i2">🌿</div>
<h3>牛奶每天送到</h3>
<p>本地牧场的鲜牛奶每天早上送到店里,拿铁和卡布奇诺只用当天的新奶。</p>
</div>
<div class="card">
<div class="icon i3">🍞</div>
<h3>面包早上现做</h3>
<p>可颂和肉桂卷每天早上六点进烤箱,卖完就收摊,不卖隔夜面包。</p>
</div>
</div>
</div>
</section>
<section class="menu" id="menu">
<div class="wrap">
<h2 class="sec-title">今日菜单</h2>
<p class="sec-sub">价格都是到店价,堂食和外带一样。</p>
<div class="menu-grid">
<div class="dish">
<div class="dish-img d1">☕</div>
<div class="dish-body"><h3>手冲咖啡 <b>¥28</b></h3><p>本周豆子:耶加雪菲,水洗,中浅烘,柑橘和茉莉花的味道。</p></div>
</div>
<div class="dish">
<div class="dish-img d2">🥛</div>
<div class="dish-body"><h3>燕麦拿铁 <b>¥30</b></h3><p>浓缩加燕麦奶,坚果香明显,不爱喝牛奶的客人常点它。</p></div>
</div>
<div class="dish">
<div class="dish-img d3">🍫</div>
<div class="dish-body"><h3>摩卡 <b>¥32</b></h3><p>浓缩、巧克力和热牛奶,上面一层薄薄的可可粉。</p></div>
</div>
<div class="dish">
<div class="dish-img d4">🫐</div>
<div class="dish-body"><h3>蓝莓气泡水 <b>¥24</b></h3><p>不含咖啡因,现打的气泡水加蓝莓和迷迭香,夏天卖得最好。</p></div>
</div>
<div class="dish">
<div class="dish-img d5">🥐</div>
<div class="dish-body"><h3>黄油可颂 <b>¥16</b></h3><p>早上六点出炉,外层酥脆,里面一层一层撕着吃。</p></div>
</div>
<div class="dish">
<div class="dish-img d6">🍰</div>
<div class="dish-body"><h3>巴斯克蛋糕 <b>¥26</b></h3><p>每天限量十二份,表面焦香,里面还是流心的。</p></div>
</div>
</div>
</div>
</section>
<section>
<div class="wrap">
<div class="stats">
<div class="stat"><b>3 年</b><span>在这条街上开店</span></div>
<div class="stat"><b>12 种</b><span>轮换的单品豆</span></div>
<div class="stat"><b>400+</b><span>每天接待的客人</span></div>
<div class="stat"><b>4.9 分</b><span>客人的平均评分</span></div>
</div>
</div>
</section>
<section id="reviews" style="padding-top: 0;">
<div class="wrap">
<h2 class="sec-title">客人怎么说</h2>
<p class="sec-sub">门口留言本上的原话。</p>
<div class="reviews">
<div class="review">
<div class="stars">★★★★★</div>
<p>“每天上班路过买一杯手冲,店员记得我喝耶加雪菲不加糖。早上这五分钟是一天里最安静的时候。”</p>
<footer>—— 住在隔壁小区的阿May</footer>
</div>
<div class="review">
<div class="stars">★★★★★</div>
<p>“带电脑来写稿坐了一下午,没人催我走。插座够多,音乐声音刚好,周末我基本都泡在这里。”</p>
<footer>—— 自由撰稿人老陈</footer>
</div>
</div>
</div>
</section>
<section id="visit" style="padding-top: 0;">
<div class="wrap">
<h2 class="sec-title">来店里坐坐</h2>
<p class="sec-sub">不用预约,直接来就行。</p>
<div class="info">
<div class="info-box">
<h3>营业时间</h3>
<p>周一至周五 7:00 – 19:00<br>周六、周日 8:00 – 20:00<br>法定节假日照常营业</p>
</div>
<div class="info-box">
<h3>地址</h3>
<p>阳光路 88 号街角<br>地铁 2 号线阳光路站 B 出口<br>出来走 50 米就是</p>
</div>
<div class="info-box">
<h3>联系方式</h3>
<p>电话:010-8888 6666<br>微信:morning-light-cafe<br>接受预订和外带电话下单</p>
</div>
</div>
</div>
</section>
<footer>
<p>晨光咖啡 Morning Light Coffee · 本站为演示网站,内容均为虚构 · 部署于 Cloudzyro 免费档</p>
</footer>
</body>
</html>
部署好的效果可以看这里:https://morning-light-cafe-site.cloudzyro.app/
评论区