阿 CHUA · CLOUDFLARE 实作教学
6个步骤把你的网站,放上网。
打开 Cloudflare,跟着下方截图做。
打开 Cloudflare ↗直接开始 ↓打开 Cloudflare,找到 Pages
点这里登录 Cloudflare ↗。进入 Compute → Workers & Pages → Create application,再点下图的 Continue to Pages。
选择拖放上传
找到 Drag and drop your files,点击这一栏右侧的 Get started。
给网站取一个名字
在 Project name 填入你自己的项目名称。建议用简短的英文小写、数字和连字符,例如 my-business-site。确认网址提示后,点击 Create project。
把完整网站拖进去
把成品网站文件夹或 ZIP 拖进上传框;也可以点击 file 选 ZIP,或点击 folder 选文件夹。等待所有文件上传完成,再点击 Deploy site。
以后更新,回到同一个项目
修改网站后重新导出完整成品。打开原本的 Pages 项目,点击 Create deployment,选择 Production,上传新版本,再点击 Save and deploy。
怎么换 pages.dev 前面的名字?
免费的 Pages 网址建好后不能直接改名。想换名字,可以把网站发布到新项目。
- 新建项目。按第 1、2 步进入 Pages,选择拖放上传。
- 填新名字。在 Project name 输入想用的名字,确认画面显示的网址,点 Create project。
- 重新上传。拖入完整网站,点 Deploy site。打开新网址检查,再替换发给学员的旧链接。
旧链接不会自动跳转。官方说明 ↗
已经有自己的域名?继续看 Custom Domain ↓加一步 · 想用自己的网址时再做
Custom Domain:使用自己的域名
想让网址变成 www.yourbrand.com?先准备一个你已经拥有的域名,再跟着下面两张图操作。没有域名,可以继续用免费的 pages.dev 网址。
① 打开项目 → Custom domains
点击 Set up a custom domain。
② 填入自己的域名 → Continue
在 Domain 输入你拥有的域名,例如 www.yourbrand.com,再点 Continue。
③ 按提示完成 DNS,等到可用再分享
DNS 就是把域名指向你的网站。Cloudflare 会提示需要设置的记录。使用根域名(例如 yourbrand.com)时,需要把域名加入 Cloudflare 并设置它提供的 nameservers;使用 www 等子域名时,按提示设置 CNAME。配置完成后,等域名状态显示 Active,打开新网址确认能用。
自有域名通常有注册/续费费用;不买域名也可以完成前面的 6 个步骤。查看官方域名说明 ↗
如果只是想改后台的项目名称
打开项目 → Settings → General → Name → Rename,填写新名称后点击 Save。这个操作只改后台名称,不会改变 pages.dev 网址。要改免费网址的名字,请看前面的 Subdomain 步骤;要使用自己购买的域名,再用 Custom domains。
READY TO SHARE
上线后,再检查这 4 件事。
分享项目的正式网址,例如 chua-pages-demo.pages.dev。带有部署编号的链接是某一次版本的专属地址。
卡住了?从这里看。
首页打不开,或出现 404
检查 index.html 是否位于上传内容根目录,而不是多包了一层文件夹。确认上传的是成品网站,而非需要构建的源码。
图片不见了
确认图片有一起上传,路径和文件名大小写正确。上传完整文件夹,保留原本的目录结构。
项目名称不能用
根据名称输入框的提示调整名称。最终可用网址以 Cloudflare 显示的结果为准,不要直接照抄本课已使用的示范名。
改了内容,网址却还是旧的
确认新部署成功,而且选择了 Production。打开项目的正式网址,重新整理页面;不要停留在旧版本的专属链接。
这套方法适用于什么网站?
适用于已经导出的静态网站。需要服务器、数据库或登录服务的应用,需另外配置部署方式。本课只讲新的 Cloudflare 上传流程。