新人 AI 工作 SOP
网站部署上线
面向使用 AI 但不懂代码的新手。你负责点击操作，AI 负责技术判断。遇到任何困难，把信息发给 AI，让部署上线这件事变成一条清晰、可回退、可复用的路径。
一、这个 SOP 是给谁用的
当你已经有一个网站项目，代码已经上传到 GitHub 后，可以用这个 SOP 完成上线。
适合的场景
- 纯展示类网站（官网、活动页、个人主页）
- 带搜索、登录等交互功能的网站
- 工具页、落地页上线
你需要准备的账号
| 账号 | 干什么用的 | 是否必须 |
|---|---|---|
| GitHub 账号 | 存放你的网站代码 | 必须 |
| Cloudflare 账号 | 放你的网站，让用户能访问 | 必须 |
| Railway 账号 | 放你的后端程序（只有网站有搜索/登录等功能时才需要） | 有后端时必须 |
| 代理工具（翻墙软件） | 注册和配置海外平台时需要 | 必须（见第二章） |
| AI 工具（如 TRAE） | 遇到任何困难随时问 AI | 强烈建议 |
二、网络环境说明（重要）
各平台在国内能不能打开？
| 平台 | 国内状态 | 用来干什么 |
|---|---|---|
| Cloudflare Pages | 能直接打开 | 放你的网站 |
| DeepSeek | 能直接打开 | AI 服务（如果你的网站用到了） |
| GitHub | 时好时坏 | 存代码 |
| Cloudflare 操作后台 | 建议开代理 | 配置网站部署 |
| Railway | 打不开 | 放后端程序 |
| Vercel | 打不开 | 不要用这个 |
什么时候要开代理，什么时候不用？
| 你在做什么 | 要开代理吗？ | 说明 |
|---|---|---|
| 注册 GitHub / Cloudflare / Railway 账号 | 要开 | 注册时可能需要验证，不开代理可能卡住 |
| 在 Cloudflare 后台操作 | 建议开 | 开了更稳定，不容易加载失败 |
| 上传代码到 GitHub | 看情况 | 有时候能传成功，传不上去就开代理 |
| 别人访问你的网站 | 不用开 | 网站放在 Cloudflare 上，国内直接能打开 |
上传代码到 GitHub 总是失败？
如果你在上传代码到 GitHub 时经常失败，可能是网络问题。不要自己折腾网络设置，直接问 AI：
三、部署前准备
在开始部署前，确认以下内容：
- 已注册并登录 Cloudflare 账号（注册时需要开代理）
- 已有 GitHub 账号，网站代码已经上传到 GitHub 仓库
- 如果你的网站有搜索、登录等交互功能，还需要准备好后端代码的 GitHub 仓库
四、前端部署到 Cloudflare Pages
这是核心步骤。Cloudflare Pages 是一个免费的网站托管平台，放在上面的网站国内用户可以直接访问。
进入 Cloudflare 后台
打开 https://dash.cloudflare.com/（建议开代理），登录后进入控制台首页。
找到 Workers & Pages
在左侧菜单栏找到 Workers & Pages，点击进入。
如果左侧菜单很多，在 Build / Compute 分类下找。
↑ 在左侧找到 Workers & Pages，然后点右上角蓝色按钮 Create application
创建新应用
点击右上角蓝色按钮 Create application。
中文理解：就是"创建新项目"的意思。
选择部署 Pages（不要选 Worker！）
默认显示 Create a Worker。不要点这个！我们是部署网站页面，需要选 Pages。
在页面下方找到 "Looking to deploy Pages? Get started"，点击 Get started。
↑ 不要选 Create a Worker，在页面底部找到 "Looking to deploy Pages? Get started" 点这个
选择从 GitHub 导入
选择 Import an existing Git repository，点击 Get started。
中文理解：从 GitHub 上已有的代码仓库导入。这样以后你更新了 GitHub 上的代码，Cloudflare 会自动帮你重新部署。
↑ 选第一个 "Import an existing Git repository"，然后点 Get started
选择 GitHub 仓库
确认 GitHub 账号是否正确 → 在 Select a repository 区域选择你的网站仓库。
仓库太多可以在搜索框输入名称搜索。
如果找不到仓库怎么办？
页面底部会提示 "configure repository access for the Cloudflare Pages app on GitHub"，点击 Cloudflare Pages 链接：
- 进入 GitHub 授权设置页面
- 选择允许 Cloudflare Pages 访问的仓库
- 勾选目标仓库 → 保存
- 回到 Cloudflare 页面刷新，重新搜索
填写配置信息（不知道怎么填就问 AI）
选择仓库后会进入配置页面，需要填写几个信息。这里有英文术语，你不需要自己判断怎么填。
AI 告诉你每个空填什么后，照着填就行。
↑ 选择你的仓库后，剩下的配置不知道怎么填就把仓库地址发给 AI 让它告诉你
点击部署
配置完成后，点击页面底部的 Save and Deploy 按钮。
中文理解：保存并开始部署。Cloudflare 会开始自动构建你的网站。
等待部署完成
部署过程中会显示构建过程（一堆英文日志，看不懂没关系）。
如果部署成功，会出现成功页面，显示：
Success! Your project is deployed to Region: Earth
并展示一个网址，例如 website-deploy-sop.pages.dev。
↑ 看到这个页面就代表部署成功了！出现这个地球图和网址就对了
找到正式网站地址
在项目详情页 Deployments → Production 区域，可以看到你的网站地址：
https://你的项目名.pages.dev
这个地址就是正式访问地址，可以分享给任何人。
xxx.pages.dev 是对外分享用的；还有一种带随机前缀的地址（比如 4601e4a2.xxx.pages.dev）是某次部署的预览链接，一般不用管。对外分享用正式地址。
↑ 在 Deployments 页面找到 Production 区域，这里显示的就是你的正式网站地址
五、后端部署到 Railway
Railway 是一个免费的后端托管平台（每月有 $5 免费额度）。你可以理解为：Cloudflare Pages 是放前端网页的，Railway 是放后端程序的。
注册 Railway 账号（需要开代理）
打开 https://railway.app
点击右上角 Login 按钮
选择 Login with GitHub
中文理解：用 GitHub 账号直接登录，不需要单独注册
首次登录会弹出 GitHub 授权页面，点击 Authorize Railway 同意授权
授权后自动进入 Railway 控制台首页
↑ 打开 railway.com/login，点 "Continue with GitHub" 用 GitHub 账号登录
创建新项目
在 Railway 控制台首页，点击 New Project 按钮
弹出选项菜单，选择 Deploy from GitHub repo
中文理解：从 GitHub 仓库部署
↑ 点 New Project 后弹出菜单，选 "Deploy from GitHub repo"
选择后端仓库
选择 Deploy from GitHub repo 后，会显示你的 GitHub 仓库列表
在列表中找到并点击你的后端代码仓库
选择仓库后，Railway 会自动开始构建和部署
构建过程可能需要 1-3 分钟，耐心等待
↑ 在列表里找到你的后端仓库，点击它
↑ 选好仓库后点 "Deploy Now" 就会开始自动部署
配置密钥和参数（让 AI 告诉你填什么）
进入刚创建的项目页面，点击顶部的 Variables 标签
点击 New Variable 按钮，逐个添加参数
https://platform.deepseek.com（国内能直接打开，不用开代理）注册登录 → 左侧菜单找 API Keys → 点 创建 API Key → 复制密钥。然后把密钥填到 Railway 的 Variables 里。
生成公网访问地址
进入项目页面，点击 Settings 标签
找到 Networking 区域
点击 Generate Domain 按钮
Railway 会自动生成一个公网地址，格式类似：
↑ 这就是 Railway 的项目控制台。Settings 标签里可以找到 Networking 和 Generate Domain 按钮。Variables 标签里可以添加参数。Logs 标签可以看运行日志。
验证后端是否正常运行
在浏览器中打开后端地址，在后面加上 /health：
如果看到页面显示 {"status":"ok"} 或者类似的文字，说明后端正常运行。
验证失败就找 AI 帮忙
如果验证失败（比如页面显示错误、打不开），进入项目的 Logs 标签查看运行日志
把日志里的报错信息复制发给 AI，让 AI 帮你排查
六、让国内用户能访问后端（AI 帮你做）
原理（简单理解）：用户访问你的网站 → Cloudflare 收到请求 → 帮你转发到 Railway 后端 → 后端返回数据 → Cloudflare 再返回给用户。整个过程用户完全感觉不到。
操作步骤
把信息发给 AI，让 AI 帮你创建中转文件
不要自己写代码！把以下信息发给 AI：
确认文件已经放好
如果你用 AI 编程工具（如 TRAE），AI 会自动帮你创建文件并推送到 GitHub。
如果你没有用 AI 编程工具，可以手动在 GitHub 网页上操作：打开你的仓库页面 → 点 Add file → Create new file → 按照 AI 告诉你的文件名和内容填入。
等 Cloudflare 自动重建
文件推送到 GitHub 后，Cloudflare 会自动检测到新代码并重新构建网站，通常 2-3 分钟完成。
你可以在 Cloudflare 控制台 Deployments 页面查看构建进度。
验证中转是否正常
等 Cloudflare 构建完成后（显示绿色），在浏览器中打开：
如果看到 {"status":"ok"} 或者类似的文字，说明中转配置成功了！
七、部署后检查事项
网站上线后，不要只看 Cloudflare 显示成功，还需要自己打开网站检查一遍。
检查清单
- 打开正式网站地址，确认页面能正常打开
- 检查首页内容是否显示正常（文字、图片有没有错位）
- 检查按钮、链接、图片是否能正常点击和显示
- 用手机打开网站地址试试（很重要！）
- 如果网站有搜索功能，试试搜索能不能用
- 如果网站有表单，试试能不能提交
八、遇到问题怎么办
问题 1：在 Cloudflare 找不到 GitHub 仓库
原因：Cloudflare 没有获得你 GitHub 仓库的访问权限。
解决：点击页面底部的 Cloudflare Pages 授权链接，到 GitHub 重新勾选目标仓库授权。
问题 2：部署失败了（显示红色）
原因：可能是配置填错了、代码有问题、或者依赖文件冲突。
解决：不要反复点击重新部署！把构建日志里的红色报错信息复制发给 AI：
问题 3：部署成功但页面是空白的
原因：通常是配置里的"输出目录"填错了。
解决：把你的 GitHub 仓库地址发给 AI，问 AI "输出目录应该填什么"，然后去 Cloudflare 修改配置重新部署。
问题 4：网站能打开但搜索/功能用不了
原因：后端可能没正常运行，或者中转文件配置有问题。
解决：
- 先确认 Railway 后端是否正常：开代理打开
你的后端地址/health - 如果后端正常，把浏览器里的报错信息截图发给 AI
问题 5：Cloudflare 显示 522 错误
原因：可能是网站还在构建中，或者构建失败了。
解决：去 Cloudflare 控制台 Deployments 页面看看构建状态。如果显示红色（失败），按问题 2 的方法处理。
问题 6：提示有安全漏洞
原因：你的项目用到了某个有安全问题的依赖包。
解决：把提示信息发给 AI，让 AI 帮你升级到安全版本并重新推送。
问题 7：Vercel 在国内打不开
原因：Vercel 在国内被墙了。
解决：改用 Cloudflare Pages 部署。这就是本 SOP 推荐用 Cloudflare 的原因。
九、给 AI 的提问模板
整个部署过程中，遇到任何不确定的地方，都可以用以下模板问 AI。记住一个原则：信息越详细，AI 回答越准。
十、后续维护
更新网站内容
如果你修改了网站代码（或让 AI 帮你改了），只需要把新代码推送到 GitHub，Cloudflare 就会自动重新部署。不需要手动操作。
查看网站状态
- Cloudflare：控制台 → Workers & Pages → 点你的项目 → Deployments 看每次部署是否成功（绿色=成功，红色=失败）
- Railway：控制台 → 点你的项目 → Logs 看后端运行日志
查看网站访问数据
Cloudflare 自带免费的数据统计功能：
- 控制台 → 点你的项目 → Analytics 标签
- 可以看到：访问次数、访客数量、流量来源、访问者国家分布等
网站监控（可选）
推荐用 UptimeRobot（https://uptimerobot.com）免费监控网站是否在线：
- 每 5 分钟自动检查一次你的网站能不能打开
- 网站打不开了立刻发邮件通知你
- 免费版支持 50 个网站监控
回退到旧版本
如果新版本有问题，可以回退到之前能用的版本：
- Cloudflare：Deployments 页面 → 找到之前显示绿色的那次构建 → 点 Promote to production
- Railway：Deployments 页面 → 找到之前的部署 → 点 Redeploy
十一、流程总结
第一步：前端部署（必须）
- 登录 Cloudflare → 找到 Workers & Pages → 点 Create application
- 选 Pages → Get started → 选 Import an existing Git repository
- 连接 GitHub → 选择你的网站仓库
- 填写配置信息（不知道怎么填就问 AI）
- 点 Save and Deploy → 等待构建完成
- 复制
xxx.pages.dev网站地址
第二步：后端部署（有搜索/登录等功能时需要）
- 登录 Railway → New Project → Deploy from GitHub repo
- 选后端仓库 → 配置参数（问 AI 要填什么）
- Settings → Networking → Generate Domain → 记下后端地址
- 开代理验证后端地址能不能打开
第三步：配置中转（有后端时必须）
- 把前端仓库地址和后端地址发给 AI
- 让 AI 帮你创建中转文件并推送到 GitHub
- 等 Cloudflare 自动重建（2-3 分钟）
- 验证
你的网站/api/health能不能打开
三个重要地址（记好）
| 名称 | 地址格式 | 用来干什么 |
|---|---|---|
| 网站地址 | https://xxx.pages.dev | 分享给用户访问 |
| 后端地址 | https://xxx.up.railway.app | 告诉 AI，让它帮你配置中转 |
| 检查地址 | https://xxx.pages.dev/api/health | 验证网站功能是否正常 |
记住这些原则
- 网站部署选 Pages，不要选 Worker
- 找不到 GitHub 仓库，去检查授权
- 不知道配置怎么填，不要瞎填，问 AI
- 部署成功不等于网站没问题，要自己打开检查
- 对外分享用
xxx.pages.dev正式地址 - 遇到失败，先复制报错信息问 AI，不要反复点击部署
- 如果 AI 也卡住了，换个 AI 工具试试，或者搜索报错信息
- 你不是一个人在战斗：技术的事交给 AI，你负责点击和判断