T

TokenCost 生产环境配置向导

4 步把 Demo 变真实付费系统。全程约 30 分钟。

⚙ 待配置
1
注册 Supabase(用户认证 + 数据库)
免费 tier 足够用,5 分钟搞定
  1. 访问 supabase.com → Start your project → 用 GitHub 登录
  2. Create a new project → 填名字(如 tokencost)→ 设数据库密码 → 选离用户最近的区域(亚洲选 ap-southeast-1 Singapore
  3. 等待项目创建完成(约 2 分钟)
  4. 左侧菜单 → SQL Editor → New query → 粘贴下面全部 SQL → Run
📋 点击展开 SQL(复制全部内容)
-- 复制 schema.sql 全部内容到 Supabase SQL Editor 运行 -- Enable pgcrypto for gen_random_uuid() CREATE EXTENSION IF NOT EXISTS pgcrypto; -- Profiles table CREATE TABLE IF NOT EXISTS profiles ( id UUID PRIMARY KEY REFERENCES auth.users(id) ON DELETE CASCADE, email TEXT, full_name TEXT, avatar_url TEXT, plan TEXT DEFAULT 'free' CHECK (plan IN ('free', 'pro', 'enterprise')), created_at TIMESTAMPTZ DEFAULT now(), updated_at TIMESTAMPTZ DEFAULT now() ); -- Auto-create profile on signup CREATE OR REPLACE FUNCTION handle_new_user() RETURNS TRIGGER AS $$ BEGIN INSERT INTO profiles (id, email, full_name, plan) VALUES (NEW.id, NEW.email, COALESCE(NEW.raw_user_meta_data->>'full_name', ''), 'free'); RETURN NEW; END; $$ LANGUAGE plpgsql SECURITY DEFINER; DROP TRIGGER IF EXISTS on_auth_user_created ON auth.users; CREATE TRIGGER on_auth_user_created AFTER INSERT ON auth.users FOR EACH ROW EXECUTE FUNCTION handle_new_user(); -- Subscriptions table CREATE TABLE IF NOT EXISTS subscriptions ( id UUID PRIMARY KEY DEFAULT gen_random_uuid(), user_id UUID REFERENCES auth.users(id) ON DELETE CASCADE NOT NULL, ls_customer_id TEXT, ls_subscription_id TEXT UNIQUE, ls_variant_id TEXT, status TEXT DEFAULT 'inactive', plan TEXT DEFAULT 'free', current_period_start TIMESTAMPTZ, current_period_end TIMESTAMPTZ, canceled_at TIMESTAMPTZ, created_at TIMESTAMPTZ DEFAULT now(), updated_at TIMESTAMPTZ DEFAULT now() ); -- RLS ALTER TABLE profiles ENABLE ROW LEVEL SECURITY; ALTER TABLE subscriptions ENABLE ROW LEVEL SECURITY; CREATE POLICY "Users read own profile" ON profiles FOR SELECT USING (auth.uid() = id); CREATE POLICY "Users update own profile" ON profiles FOR UPDATE USING (auth.uid() = id); CREATE POLICY "Users read own subs" ON subscriptions FOR SELECT USING (auth.uid() = user_id);

SQL 跑完后 → 左侧菜单 Settings → API → 复制下面两个值:

2
注册 Lemon Squeezy(收款)
创建账号 + 产品 + 获取 Key,10 分钟
  1. 访问 www.lemonsqueezy.com → 注册(建议先用 Test Mode 测试)
  2. 左侧菜单 → Developers → API keys → 复制 Publishable key(以 pk_test_pk_live_ 开头)
  3. 左侧菜单 → Products → Add product → 创建两个产品:
产品名 价格 计费周期
Pro Monthly $9.90 Monthly (recurring)
Pro Annual $95.00 Yearly (recurring)

创建后,点击每个产品 → 复制 Variant ID(以 price_ 开头):

3
部署 Supabase Edge Function(支付中间层)
部署一个云函数处理 Lemon Squeezy 结账,5 分钟

在你的电脑上安装 Supabase CLI 并部署(需要 Node.js,你已经有):

# 1. 安装 Supabase CLI(如果还没装) npm install -g supabase # 2. 登录 supabase login # 3. 进入项目目录 cd ai-token-analyzer # 4. 初始化(选你的 Supabase 项目) supabase init supabase link --project-ref YOUR_PROJECT_REF # 5. 设置环境变量(Lemon Squeezy API Key) supabase secrets set LEMONSQUEEZY_API_KEY=ls_key_xxxxxxxxx supabase secrets set SUPABASE_URL=https://xxxxxxxxx.supabase.co supabase secrets set SUPABASE_ANON_KEY=eyJhbGci... # 6. 部署函数 supabase functions deploy create-checkout

⚠ Lemon Squeezy API Key 在 Stripe Dashboard → Developers → API keys → Secret key(以 sk_test_ 或 sk_live_ 开头)。这个不要公开,只放云函数环境变量里。

部署成功后,复制 Edge Function URL:

4
部署 Webhook 服务 + 上线
接收 Lemon Squeezy 支付回调,部署网站,10 分钟

A. 部署 Webhook 服务(可选但推荐,用于自动开通会员)

# Webhook 部署到 Railway / Render / Fly.io # 以 Railway 为例: # 1. 去 railway.app → New Project → Deploy from GitHub # 2. 选择你的仓库 → 设置 Root Directory = server/ # 3. 添加环境变量: # LEMONSQUEEZY_API_KEY=sk_test_xxx # LEMONSQUEEZY_WEBHOOK_SECRET=ls_whsec_xxx (从 Lemon Squeezy Settings → Webhooks 获取) # SUPABASE_URL=https://xxx.supabase.co # SUPABASE_SERVICE_ROLE_KEY=xxx (Supabase → Settings → API → service_role key) # 4. Deploy → 拿到 URL(如 https://tokencost-webhook.up.railway.app) # 5. 去 Lemon Squeezy Settings → Webhooks → Add endpoint # URL = https://tokencost-webhook.up.railway.app/webhook # Events = checkout.session.completed, customer.subscription.updated, customer.subscription.deleted

B. 部署网站

# 部署到 Vercel(免费,推荐): # 1. 去 vercel.com → New Project → Import 你的仓库 # 2. Root Directory = ai-token-analyzer/ # 3. Deploy → 绑定你的域名 # 或者部署到 Cloudflare Pages(免费): # 1. Cloudflare Dashboard → Workers & Pages → Create # 2. 连接 GitHub 仓库 → 构建输出目录 = ai-token-analyzer/ # 3. Deploy → 绑定域名

保存配置
填入所有值后,点保存 → Demo 模式关闭 → 真实系统上线

确认以上所有输入框都已填好,然后:

保存后,打开 index.html — Demo Mode 横幅消失,注册/登录/支付全部走真实后端。