如何让Stripe支付链接的prefilled_email字段设为只读？

目前Stripe官方的**支付链接（Buy Links）**并不支持将prefilled_email预填的邮箱字段设置为只读。这类链接是为快速生成标准化支付页面设计的，仅提供有限的自定义选项，无法修改字段的可编辑状态。

如果需要实现邮箱字段只读的需求，只能切换到使用stripe.checkout.Session.create创建自定义Checkout会话的方案，这也是社区里主流的解决方案。结合你的Next.js 14.0.4项目，具体实现步骤如下：

1. 在Next.js的API路由中创建Checkout会话
   在app/api/stripe/create-session/route.ts中编写逻辑：

   import { NextResponse } from 'next/server';
   import Stripe from 'stripe';
   
   const stripe = new Stripe(process.env.STRIPE_SECRET_KEY!, {
     apiVersion: '2023-10-16', // 匹配你的Stripe API版本
   });
   
   export async function POST(request: Request) {
     const { userEmail, priceId } = await request.json();
   
     const session = await stripe.checkout.sessions.create({
       payment_method_types: ['card'],
       line_items: [
         {
           price: priceId, // 替换为你的Stripe价格ID
           quantity: 1,
         },
       ],
       mode: 'payment',
       success_url: `${process.env.NEXT_PUBLIC_APP_URL}/success?session_id={CHECKOUT_SESSION_ID}`,
       cancel_url: `${process.env.NEXT_PUBLIC_APP_URL}/cancel`,
       customer_email: userEmail, // 预填用户邮箱，此字段默认不可编辑
     });
   
     return NextResponse.json({ url: session.url });
   }
   

2. 前端触发会话创建并跳转
   在你的页面组件中，调用上述API获取会话链接并跳转：

   async function handlePayment() {
     const response = await fetch('/api/stripe/create-session', {
       method: 'POST',
       headers: {
         'Content-Type': 'application/json',
       },
       body: JSON.stringify({
         userEmail: 'acd@example.com', // 你的用户邮箱
         priceId: 'price_xxxxxx', // 替换为实际价格ID
       }),
     });
     const { url } = await response.json();
     window.location.href = url;
   }
   

通过这种方式生成的Checkout页面，预填的邮箱字段会自动变为只读状态，完全满足你的需求。

内容的提问来源于stack exchange，提问作者DigiLeon