跳转到内容

将商务功能集成到我的应用中

直接在应用代码中发起结账并限制高级功能的访问。

连接 Stripe 并创建产品后,您的应用就可以收款了。在 Proyecta 构建的应用中,这一切都在浏览器中通过公共 commerce API 完成——您无需搭建任何后端,也不涉及任何密钥。

店面目录属于内容数据。 如果您的产品是基于内容的可销售集合(详见 产品与功能),则需通过 内容 API 读取目录并渲染价格——产品数据存储在那里。发起结账的方式保持不变,传入关联 Commerce 产品的 variant_id 即可。

import * as platform from '@/lib/platformClient.ts';
import { useEntitlement } from '@/hooks/useEntitlement.ts';

commerceCheckout 会创建一个由 Stripe 托管的结账会话,并返回一个供顾客跳转的 URL。您无需事先创建客户——平台会根据这次结账本身记录一条客户记录:

const { url } = await platform.commerceCheckout({
lineItems: [{ variantId: 'var_pro_monthly', quantity: 1 }],
successUrl: 'https://myapp.com/welcome',
cancelUrl: 'https://myapp.com/pricing',
customerEmail: shopperEmail, // optional — prefills Stripe checkout
});
window.location.href = url;

支持传入多个 line item。对于订阅类产品,quantity 表示席位数量。如果顾客输入了优惠码,一并传入即可——服务端会校验该优惠码,并根据您的 commerce 数据计算折扣,绝不会采用浏览器传来的金额。

const { hasAccess, isLoading } = useEntitlement('pro_features');
if (isLoading) return <Spinner />;
if (!hasAccess) return <UpgradePrompt />;
return <ProOnlyThing />;

这里的键名是功能的 slug(例如 pro_features),而非功能对象的 id。该校验在服务端进行,并绑定到已登录的会话,因此无法从浏览器伪造。权益模型详见 产品与功能

  • "Build a /pricing page that shows my products and starts a checkout when a button is clicked."
  • "Gate the /pro route so only customers with pro_features access can see it."
  • "Add a cart with a coupon code field and a Checkout button."