道友请了,我是「猫来gogogo」,一个正在学习AI的新新人类。
AI一天,人间一年。
这一次,我 花了两周时间,0代码基础,从0开始,上线一个智能体平台网站 。
真的只有两周时间吗?
有图有真相,总共12天。
我也体会到了,拥有自己产品的乐趣。
目前网站做了6个图像智能体,包括:
桌面手办、换个发型、老照片修复、一页手绘日记、狗狗入狱照、图生链接。
接下来,也会不断增加更多更好用的智能体。
图片智能体,都是接入豆包最新的生图API, 不需要写复杂的提示词,实现一键出图。
对于生成的作品,还可以下载和分享到灵感广场;
灵感广场的图片也可以一键做同款。
欢迎体验和提建议。
网站地址:https://zaowu.maolai.cc
因为使用了边缘服务,第一次加载可能有点慢,后面就正常了。
那么,这样一个网站是如何做出来的呢?
我将会用一个专栏,从头到尾介绍这个网站的出生过程。
本文是合集的第 2 篇文章:
02 注册 cloudflare 账号,认识数据库和对象存储
第1步:注册cloudflare账号
这个服务没有限制,直接用国内的QQ邮箱或者网易云邮箱注册就可以。
网址:https://dash.cloudflare.com/sign-up
如果网站是英文,在右上角,把语言切换成简体中文就行。
登录网站以后,我们先了解 D1数据库。
第2步:创建D1数据库
点击左侧菜单的“D1 SQL 数据库”,进入数据库页面。
这就是项目以后存储用户数据,作品数据,积分数据的地方了。
我们先看一下免费额度:
- •
每个账户可以创建 10 个数据库; (一个项目是2个数据库,包括开发库,生产库,也就是说可以做5个项目,如果超过5个项目,再创建一个账户就是了,反正cloudflare没有任何限制。)
- •
所有数据库总容量为 5GB, 单个数据库最大 500MB; (数据表占用很小,500M最少支持1万人使用)
- •
数据库支持每日 500 万行读取 (指的是用户请求一次接口),每日 10 万行写入 (指的是用户写入一条数据,比如注册和生成内容),最关键的是, 额度每天刷新!
总的来说,这样一个免费额度, 最少支持每天 5000 个活跃用户, 以及 800-1500 个并发用户。
这是什么概念?
如果你做的网站, 每天超过了5000活跃用户 ,那也只需要付费20美元升级一下。
相信你挣的钱,一定早就不止这点了。
放心大展拳脚吧!
好,让我们回到项目上,我建议同时创建“开发库”和“线上库”,好处如下:
- •
开发环境和线上环境隔离 ,防止在开发功能时,影响到线上环境。
- •
在开发时,便于让AI直接在两个库创建和修改数据表,防止开发好以后,都忘记了创建哪些表和索引了,导致线上环境有问题。
这里不了解没关系,项目开发时有AI协助。
我们要做的,就是 创建两个数据库,把名称和ID记录下来,后面提供给AI就行 。
如何创建数据库呢?
在上图的数据库主页,点击右上角“创建数据库”,进入创建页面,
输入数据库名称,点击“创建”按钮即可创建一个数据库。
比如我的项目是造物,创建两个数据库就是:
- •
zaowu-dev
- •
zaowu-pro
我通过 dev 代表开发库,pro 代表线上库。
好的,现在回到数据库页面,记录一下两个数据库的 名称和ID ,后面需要告诉AI。
这里有个操作上的问题,我刚开始用时,迷惑了半天,
因为我死活找不到,在哪里创建数据表。
在上图中,当点击某个数据库后,首先会进入数据库概述页面,
然后一定要再点击一下,上方的数据库名称,见下图,才能看到数据表。
好的,数据表的操作就是这些了,关于SQL语句什么的,后面直接让AI创建,我们不用管。
第3步:创建R2存储库
R2 存储桶是干嘛的呢?
作用是,将用户上传的图片或者视频,存储到R2存储桶里,然后R2会返回一个URL链接。
通过URL链接,任何人都可以访问图片或者视频,包括API。
在项目中,我们使用豆包API,也需要提供URL链接,所以这是调用豆包API的前提。
在哪里创建存储桶呢?
点击左侧菜单“R2对象存储”的“概述”,进入存储桶页面,见下图:
使用R2需要增加付款方式,因为每月存储超过10G,就需要额外收费了。
10G以内,是不会收费的,可能你觉得存储太少了,但绝非如此。
作为对比:如果你使用阿里云、腾讯云的存储,不仅存储空间要收费,收费比 cloudflare 要贵;
而且,当其他用户访问网站图片时,也要收费!
这叫出口费。
而 cloudflare 的R2 出口完全免费!
所以,这也是为什么 cloudflare 被称为大善人的原因之一。
其实算一下,每个月10G免费存储,
假设每个用户上传图片是2M,也支持5000次使用。
在开发阶段也完全够用了。
好的,那如何添加付款方式呢?
国内的银行卡都不支持,所以,我们需要重新申请一张 国际信用卡 。
我自己使用的是,招商银行的 全币种visa卡 。
这个卡比较适合个人使用,免年费,免手续费。
3.1 注册全币种visa信用卡
如何申请呢?
手机应用商店,下载“掌上生活”app,登录一下;
然后在搜索框,直接搜 “全币种visa”,
点击第一个,进入申请页面,
填写姓名、身份证号、手机号就可以申请了。
申请的实体卡,会通过快递发过来。
进度查询,也直接在搜索框里,搜“进度查询”,
可以查看制卡进度、快递进度,大概3-5天。
等你拿到实体卡以后,你会看到 3个重要信息:卡号、有效期、安全码 。
非常重要,卡片一定要保存好,不能遗失!遗失就赶紧挂失!
因为visa卡不需要支付密码,只需要上面3个信息就可以刷,所以一定要保存好!
3.2 绑定R2的付款方式
好的,有了 visa 卡的3个信息,我们就可以绑定到 R2 的付款账户了,见下图:
其中安全码,只需要填写后3位即可。
然后填写账户邮寄地址,点击底部确定按钮,就可以添加付款账户了。
虽然添加了付款账户,但是使用10G以内,是不会收费的,所以不用担心。
添加好付款账户后,就可以创建存储桶了。
3.3 创建存储桶
直接点击右上角“创建存储桶”,进入创建页面,只需要输入存储桶名称即可。
同样的,为了区分开发环境和线上环境,也需要创建两个,比如:
- •
zaowu-dev-r2
- •
zaowu-pro-r2
创建好以后,记录两个存储桶名称,后面需要告诉AI。
然后需要分别设置一下存储桶,
点击存储桶,点击设置,开启“公共开发URL”,
这个 必须打开,否则R2返回的URL无法访问 。
这个存储桶,也可以手动上传图片或者视频,可以试一试。
第4步:了解 pages 部署
这是干嘛的?
简单来说,这是部署项目的地方,也是网站上线最重要的一步。
大概流程是这样:
- •
当我们开发好项目功能,需要提交到云端的 GitHub 仓库;
- •
然后在 pages 里,就可以直接导入 GitHub 仓库,一键部署到云端。而且支持自动触发部署,非常方便。
项目部署完成后,就可以把网站发给用户使用了。
后面部署项目时,会详细介绍细节。
我们先了解一下 pages 的菜单位置。
点击左侧菜单的“workers和pages”,注意,我们使用的是pages,可以部署前后端代码。
而workers一般用来部署后端接口。
比如我的 造物AI 项目部署完成后,就可以直接访问了:
- •
cloudflare 会自动提供一个网站地址:https://zaowu.pages.dev/
- •
也可以自定义域名,比如我的域名网站地址:https://zaowu.maolai.cc/
好的,以上就是合集的第2篇文章内容。
我们认识了 cloudflare 的强大功能,包括:
- •
D1 数据库: 用于存储用户数据、生成数据、积分数据等;
- •
R2 存储桶: 用于存储图片内容,包括产品logo,用户头像、上传的图片等;
- •
pages 部署: 用于部署项目,提供公开网址,方便其他用户访问。
感谢阅读!
以上就是本次分享的全部内容,希望能对你有所启发。
如果觉得对你有帮助,可以点个 👇「关注」👇,持续获取更多AI干货。
我是「猫来gogogo」,持续学习与分享AI实践,敬请期待。
后记
如果道友感兴趣,可以继续关注合集的其他文章:
合集《新手小白,两周时间,学会用 cursor+cloudflare 做AI网站》 主要包括以下内容:
【项目启动】:
- •
01 我有个想法,如何落地成可执行的需求文档?
- •
02 注册 cloudflare 账号,认识数据库和对象存储
- •
03 使用 cloudflare 的官方工具搭建项目脚手架
【项目开发】:
- •
04 AI写代码总是犯错怎么办?写好项目规则是关键,避免AI重复犯错
- •
05 如何使用git 管理代码版本,将开发、线上环境隔离,防止AI乱改代码?
- •
06 如何跟 AI 结对编程?AI写前端页面和后端接口的实战技巧
- •
07 开发网站,如何让 AI 使用 wranger 直接操作 cloudflare 数据库?
【项目上线】:
- •
08 本地开发好网站,如何部署到 cloudflare ?给全球用户访问?
- •
09 如何将网站改成自己的名字?
本篇完,我们下次再见。

