• Precios
  • Blog
Iniciar sesiónAgendá una demo
Introducción

Inicio rápido

Integrar con Next.jsIntegrar con RemixIntegrar con NuxtIntegrar con SvelteKitIntegrar con AstroIntegrar con ExpressIntegrar con HonoIntegrar con Bun

Aprender

Recursos

Referencia del SDKVersionado de APIManejo de erroresTestingCLI

Plugins

Better Auth
DocumentaciónRecursosConstruir con AIAPI ReferenceWebhooks

Integrar con Next.js

Agrega cobros y pagos a tu aplicación de Next.js con Commet.

Instala la Commet Skill para que tu agente integre el SDK actual y valide su trabajo contra el contrato vivo de la API.

npx skills add commet-labs/skills --skill commet

Instalar

pnpm add @commet/node @commet/next
npm install @commet/node @commet/next
yarn add @commet/node @commet/next
bun add @commet/node @commet/next

Configurar

.env.local
COMMET_API_KEY=ck_sandbox_xxx
lib/commet.ts
import { Commet } from '@commet/node'

export const commet = new Commet({
  apiKey: process.env.COMMET_API_KEY!,
})

Crear Cliente y Suscribir

customers.create es idempotente — si ya existe un cliente con el mismo id, retorna el registro existente.

app/actions/billing.ts
'use server'

import { redirect } from 'next/navigation'
import { commet } from '@/lib/commet'

export async function subscribe(customerId: string) {
  await commet.customers.create({
    email: 'user@example.com',
    id: customerId,
  })

  const subscription = await commet.subscriptions.create({
    customerId,
    planCode: 'pro',
  })

  const checkoutUrl = subscription.checkoutUrl
  if (checkoutUrl) {
    redirect(checkoutUrl)
  }
}

El cliente es redirigido al checkout para completar el pago. Cuando checkoutUrl es null no hace falta pago y la suscripción ya está activa.

Verificar Acceso

app/actions/billing.ts
export async function getSubscription(customerId: string) {
  const subscription = await commet.subscriptions.getActive({ customerId })

  return subscription
}
app/actions/features.ts
export async function canUseFeature(customerId: string, feature: string) {
  const access = await commet.featureAccess.get({ code: feature, customerId })

  return access.allowed
}

Trackear Uso

app/actions/usage.ts
export async function trackApiCall(customerId: string) {
  await commet.usage.track({
    customerId,
    featureCode: 'api_calls',
    value: 1,
  })
}

El uso se agrega y se cobra al final del período.

Portal del Cliente

app/api/commet/portal/route.ts
import { CustomerPortal } from '@commet/next'

export const GET = CustomerPortal({
  apiKey: process.env.COMMET_API_KEY!,
  getCustomerId: async (req) => {
    return 'user_123'
  },
})
<a href="/api/commet/portal">Gestionar Cobros y Pagos</a>

Relacionado

  • Suscripciones
  • Trackear Uso
  • Portal del Cliente
  • Referencia del SDK

¿Cómo está esta guía?

Introducción

Commet es una plataforma de cobros y pagos para productos SaaS y AI.

Integrar con Remix

Agrega cobros y pagos a tu aplicación de Remix.

On this page

Instalar
Configurar
Crear Cliente y Suscribir
Verificar Acceso
Trackear Uso
Portal del Cliente
Relacionado