• 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 Remix

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

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 @remix-run/node
npm install @commet/node @remix-run/node
yarn add @commet/node @remix-run/node
bun add @commet/node @remix-run/node

Configurar

.env
COMMET_API_KEY=ck_sandbox_xxx

El sufijo .server.ts asegura que este módulo nunca se incluya en el código del cliente.

app/lib/commet.server.ts
import { Commet } from '@commet/node'

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

Suscribir

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

app/routes/billing.subscribe.ts
import { json, redirect, type ActionFunctionArgs } from '@remix-run/node'
import { commet } from '~/lib/commet.server'

export async function action({ request }: ActionFunctionArgs) {
  const formData = await request.formData()
  const customerId = String(formData.get('customerId'))
  const email = String(formData.get('email'))

  await commet.customers.create({ email, id: customerId })

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

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

  return json({ subscribed: true })
}

Verificar Acceso

app/routes/billing.status.ts
import { json, type LoaderFunctionArgs } from '@remix-run/node'
import { commet } from '~/lib/commet.server'

export async function loader({ request }: LoaderFunctionArgs) {
  const url = new URL(request.url)
  const customerId = url.searchParams.get('customerId')!

  const subscription = await commet.subscriptions.getActive({ customerId })

  if (!subscription) {
    return json({ error: 'no_active_subscription' }, { status: 404 })
  }

  const feature = await commet.featureAccess.get({
    code: 'api_calls',
    customerId,
  })

  return json({
    status: subscription.status,
    allowed: feature.allowed,
  })
}

Trackear Uso

app/routes/billing.usage.ts
import { json, type ActionFunctionArgs } from '@remix-run/node'
import { commet } from '~/lib/commet.server'

export async function action({ request }: ActionFunctionArgs) {
  const { customerId } = await request.json()

  await commet.usage.track({
    customerId,
    featureCode: 'api_calls',
    value: 1,
  })

  return json({ tracked: true })
}

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

Portal del Cliente

app/routes/billing.portal.ts
import { redirect, type LoaderFunctionArgs } from '@remix-run/node'
import { commet } from '~/lib/commet.server'

export async function loader({ request }: LoaderFunctionArgs) {
  const customerId = 'user_123'

  const portal = await commet.portal.getUrl({ customerId })

  return redirect(portal.portalUrl)
}

Relacionado

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

¿Cómo está esta guía?

Integrar con Next.js

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

Integrar con Nuxt

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

On this page

Instalar
Configurar
Suscribir
Verificar Acceso
Trackear Uso
Portal del Cliente
Relacionado