MoonTV的Vercel+Upstash的部署
使用 Vercel + Upstash Redis 部署 MoonTV 教程
由于 MoonTV 项目不再支持通过 Cloudflare Pages 进行部署,本教程使用 Vercel 结合 Upstash Redis 的方式来完成部署。这种方法功能上与原先的方式类似。
准备工作
在开始之前,请确保已经拥有以下账号:
Vercel 部署 (localStorage 模式)
此方法使用浏览器的 localStorage 进行数据存储,无需外部数据库。
第一步:Fork 项目仓库
首先,需要将 MoonTV 的官方仓库 Fork 到自己的 GitHub 账号下。
访问 MoonTV 的 GitHub 仓库地址:
https://github.com/luolehe/MoonTV
点击页面右上角的 Fork 按钮,将该项目复制到个人仓库中。
第二步:在 Vercel 中创建新项目
登录 Vercel,进入 Dashboard 仪表盘页面。
点击 Add New… -> Project。
在导入 Git 仓库页面,点击 Continue with GitHub。
如果 Vercel 请求授权,请点击授权按钮。然后,选择刚刚 Fork 的
MoonTV
仓库旁的 Import 按钮。
第三步:配置并部署项目
进入项目配置页面后,需要注意以下几点:
- Project Name:项目名称不能包含大写字母,否则会导致部署失败。可以修改为
moontv
或其他全小写名称。 - Environment Variables (环境变量):这是关键步骤。需要在这里设置登录密码。
- 在
Key
处输入PASSWORD
。 - 在
Value
处输入要设置的登录密码(例如123456
)。 - 注意:在复制粘贴变量名
PASSWORD
时,请确保其前后没有多余的空格。
- 在
- Project Name:项目名称不能包含大写字母,否则会导致部署失败。可以修改为
确认所有配置无误后,点击 Deploy 按钮开始部署。
等待部署完成。成功后,Vercel 会显示成功画面。
Upstash Redis 支持 (可选)
如果希望开启收藏、历史记录同步等功能,需要配置 Upstash Redis 数据库。
第一步:创建 Upstash Redis 数据库
登录 Upstash,进入 Redis 数据库管理页面。
点击 Create Database 创建一个新的数据库。
配置数据库:
- Name: 数据库名称,可随意填写 (如
moontv
)。 - Primary Region: 选择一个地理位置较近的区域,例如
Oregon (US-West-2)
。 - Plan: 选择 Free 免费套餐。
- Name: 数据库名称,可随意填写 (如
点击 Create 完成创建。
第二步:在 Vercel 中添加 Redis 环境变量
在 Upstash 数据库详情页面,找到并复制以下两个值:
- Endpoint (HTTPS) - 对应
UPSTASH_URL
- Token (Read-Only Token) - 对应
UPSTASH_TOKEN
- Endpoint (HTTPS) - 对应
回到 Vercel 的项目设置页面,选择 Settings -> Environment Variables。
添加以下环境变量,并填入对应的值:
UPSTASH_URL
: 粘贴 Upstash 的 Endpoint 值。UPSTASH_TOKEN
: 粘贴 Upstash 的 Token 值。NEXT_PUBLIC_STORAGE_TYPE
: 值固定为upstash
。USERNAME
: 设置一个用于数据隔离的用户名,可自定义。
再次强调:复制粘贴所有 Key 和 Value 时,请务必检查并删除前后的多余空格。
添加完成后,点击 Save 保存。
第三步:重新部署
Vercel 会检测到环境变量的变更,并提示需要重新部署。
点击页面下方出现的 Redeploy 按钮。
在弹出的窗口中再次点击 Redeploy。
等待部署完成即可。
自定义域名 (可选)
部署成功后,Vercel 会提供一个 .vercel.app
后缀的默认域名。也可以绑定自己的域名。
在 Vercel 项目设置中,进入 Domains 标签页。
输入域名并点击 Add。
Vercel 会提供需要配置的 DNS 记录(通常是一条
CNAME
记录和一条TXT
记录)。前往域名注册商(如 Cloudflare)的 DNS 管理后台,添加 Vercel 提供的这两条记录。
等待 DNS 解析生效后,即可通过自定义域名访问 MoonTV。
至此,成功部署了 MoonTV 实例。