这篇发给AI，Google登录+Stripe支付就搞定了丨附提示词哈喽，大家好！我是阿星👋 昨天我们用ai接入了st

哈喽，大家好！

我是阿星👋

昨天我们用ai接入了stripe但是还没讲怎么把用户登录系统做出来👉手把手教你跑通出海支付！Stripe接入+扣款成功全流程实录。

今天补充下这part，其实应该先做这part，不过自己干刚接触的话差不多能用就行了。

实现什么？

这里推荐的是用google登录。用户注册后可以在右上角看到自己的账号信息和订阅状况。有用户产生新的订阅，数据库里都会有相关的记录。(可以跟AI聊天配的更详细)

使用说明（必看）

1、为了方便懒得看的同学，我让codex整理了一套不但能帮你做完本文用户登录功能、还能顺带把上篇文章的stripe集成进去的提示词，没空看文章可以直接复制。（先用他生成登录系统）

2、具体手动操作步骤的话往下划拉即可。

3、看不懂没关系，直接把这篇文章发给AI即可。

看不懂代码现在也能达到同样的功能，你是小白的话，是完全可以做出来。

懒人提示词直接用

# 工程级懒人提示词（实现Google 登录 + Stripe 订阅）
把下面整段交给你的 AI 编程助手即可：
```text
你是我的全栈工程师，请在现有静态前端 + Vercel API 项目里，完整实现“Google 登录 + Stripe 订阅 + Supabase 持久化”，并满足以下硬性要求。
【目标】
1. 登录方式：Google 登录（基于 Supabase Auth OAuth）。
2. 支付方式：Stripe Checkout 订阅（月/季/年）。
3. 会员真相源：后端 webhook + Supabase 表，不允许只靠 localStorage 判权限。
4. 交互要求：会员页右上角必须有明显账号入口（头像+邮箱），可查看账号信息、管理订阅、切换账号、退出登录。
5. 安全要求：每次点击“购买/管理订阅”前，强制同步当前 Google session 到后端，防止旧账号 cookie 残留导致串号下单。
【技术栈和关键路由】
- 前端：pricing.html（静态页）
- API：
  - GET /api/auth/config
  - POST /api/auth/google-session
  - POST /api/auth/logout
  - GET /api/auth/me
  - POST /api/payments/create-checkout-session
  - POST /api/payments/customer-portal
  - GET /api/payments/subscription-status
  - POST /api/webhooks/stripe
  - GET /api/health
【数据表（Supabase）】
必须使用两张表：
- public.billing_users
- public.subscriptions
字段至少包含：
- billing_users:
 id
/email/stripe_customer_id/subscription_status/created_at/updated_at
- subscriptions: user_id/stripe_subscription_id/stripe_price_id/plan_key/status/current_period_end/cancel_at_period_end/updated_at 等
【环境变量】
必须读取并校验：
SUPABASE_URL
SUPABASE_ANON_KEY
SUPABASE_SERVICE_ROLE_KEY
AUTH_JWT_SECRET
STRIPE_SECRET_KEY
STRIPE_WEBHOOK_SECRET
STRIPE_PRICE_MONTHLY
STRIPE_PRICE_QUARTERLY
STRIPE_PRICE_YEARLY
APP_BASE_URL
STRIPE_TRIAL_DAYS
STRIPE_ALLOW_PROMO_CODES
STRIPE_PORTAL_ENABLED
【前端行为要求】
1. 未登录时：购买按钮可见，但点击后先提示 Google 登录。
2. 已登录时：右上角显示头像+邮箱；账号菜单可见。
3. 账号信息弹窗显示：邮箱、登录方式、会员状态、到期时间。
4. 手机端：账号信息字体不可过小（至少 text-sm 以上，可读）。
5. 购买前调用 ensureAuthenticatedUser()，内部必须“先强制同步 Google session -> 再读后端 session”。
【支付与会员逻辑】
1. create-checkout-session 只接受已登录用户。
2. 首次支付自动创建 Stripe customer，并回写 billing_users.stripe_customer_id。
3. webhook 监听至少 5 个事件：
   - checkout.session.completed
   - invoice.paid
   - invoice.payment_failed
   - customer.subscription.updated
   - customer.subscription.deleted
4. webhook 验签失败必须返回 400。
5. webhook 写入 subscriptions，确保幂等（按 user_id 或 stripe_subscription_id upsert）。
【缺表诊断】
1. /api/health 必须返回 billing_users 和 subscriptions 的检查结果。
2. 若缺表，错误信息必须明确提示“运行 supabase 建表 SQL 文件路径”。
【交付物】
- 代码修改
- 一份可直接执行的 Supabase SQL 文件（如 xxxx/supabase/billing_schema.sql）
- 一份部署检查文档（环境变量、Webhook、测试步骤）
【验收清单（你必须自测）】
1. Google 登录后右上角显示邮箱。
2. 切换 Google 账号后，再点购买时使用的是新账号。
3. 未订阅用户可登录，但会员状态显示“未订阅”。
4. 完成 Stripe 测试支付后，会员状态变为 active，且有 current_period_end。
5. 取消订阅后状态正确回落。
6. /api/health 返回成功并包含两张表检查项。
现在开始直接改代码，不要只给方案。改完输出：
- 修改了哪些文件
- 每个文件的关键变更
- 还需要我在 Dashboard 手动完成哪些配置

代码生成完了，

接着就是配置了，步骤也非常简单，

一共就三大步——