¿Cómo crear un sistema de suscripción con Stripe y Express js?

Por:

Denisse Abreu
Mayo 08, 2022 12pm ET

Eng/Spa 5-min

Hola 🖐🏼, esta es la segunda parte de nuestro proyecto: Crea un sistema de suscripción con Stripe y Vue js. En este blog, enseñaremos cómo integrar la parte del servidor 'backend' a este proyecto. Como ya sabes, Stripe necesita un servidor para generar el 'client secret' (la clave que le dará acceso al elemento de la tarjeta Stripe). Usaré Express js como servidor, haciendo de este proyecto una aplicación completa de javascript. Si no tienes un sistema de suscripciones, puedes copiar al mío Vue Stripe Subscriptions.

1. Configura Stripe y Express.

Primero, instale las librerías correspondientes.

Instalar a través de npm

  npm install express
  npm install --save stripe

Cree un archivo .env en la raíz del proyecto; ¡Por favor, no exponga sus claves directamente en el código!

.env

A continuación, cree Index.js; este archivo será el punto de entrada de datos. Crea un middleware que verificará si la solicitud HTTP se dirige al 'webhook'; si es así, deje pasar la solicitud sin analizarla como un objeto JSON; de lo contrario, analice los datos como un objeto JSON y rediríjalos al Express router. Si analiza como JSON los datos del webhook, Stripe los rechazará. Implementaremos el webhook en un blog aparte debido a su complejidad.

server/index.js

  require('dotenv').config()
  const express = require('express')
  const cors = require('cors')

  const app = express()

  // Middleware
  app.use((req, res, next) => {
    if (req.originalUrl === '/api/posts/webhook') {
      next()
    } else {
      express.json()(req, res, next)
    }
  })

  app.use(cors())

  // Router
  const posts = require('./routes/api/posts')
  app.use('/api/posts', posts)

  const port = process.env.PORT || 3000

  app.listen(port, () =>
    console.log(`Server is running on port ${port}.`))

Cree el archivo del Express router y comience importando Stripe y la clave secreta; el primer método HTTP es el post router. Este método creará el cliente utilizando el correo electrónico y el nombre completo. Si la creación del cliente es exitosa, envíe de vuelta a al front-end la identificación del cliente (customer id). En producción, recopila más parámetros del cliente, como la dirección y el número de teléfono; aquí, puede consultar la lista de parámetros que puede enviar a Stripe.

server/routes/api/posts.js

  require('dotenv').config()
  const express = require('express')
  const stripe = require('stripe')(process.env.STRIPE_SECRET_KEY);
  const router = express.Router()

  // Crea el Cliente
  router.post('/', async (req, res) => {

    const { email, fullname } = req.body;

    if (!email && !fullname) {
      return res.sendStatus(400);
    }

    try {
      // Pasa el nombre completo del cliente y
      // parámetros adicionales
      const customer = await stripe.customers.create({
        email: email,
        name: fullname
      })

      if (customer) {
        // guarda el customer.id como stripeCustomerId
        // en tu base de datos.
        return res.json({ customer: customer.id });
      }

    } catch (error) {
      console.log(error);
      return res.sendStatus(400);
    }
  });

El segundo método del Express router es la creación de suscripción. Destruya el 'request body' y extraiga la identificación del cliente junto con la identificación del precio, envíelos a Stripe utilizando la función de creación de suscripción. Si la función de creación de suscripción tiene éxito; extraiga la identificación de la suscripción y el secreto del cliente de la constante 'subscription' y Envíelos de vuelta al front-end como un objeto JSON.

server/routes/api/posts.js

  // Crea la suscripción
  router.post('/subs', async (req, res) => {
    const { customerId, priceId } = req.body;

    if (!customerId && !priceId) {
      return res.sendStatus(403);
    }

    try {
      const subscription = await stripe.subscriptions.create({
        customer: customerId,
        items: [{ price: priceId }],
        payment_behavior: 'default_incomplete',
        expand: ['latest_invoice.payment_intent'],
      });

      res.json({
        subscriptionId: subscription.id,
        clientSecret: subscription.latest_invoice.payment_intent.client_secret,
      });

    } catch (error) {
      return res.sendStatus(400)
    }
  });

El último método del Express router es la ruta para eliminar la suscripción. Para eliminar la suscripción, necesitamos la identificación de la suscripción (subscription id), crea un sistema de inicio de sesión (login system) en su aplicación para permitir que los usuarios eliminen sus suscripciones, y extraiga la identificación de suscripción de su base de datos local.

server/routes/api/posts.js

  // Elimina la suscripción
  router.post('/delete', async (req, res) => {
    try {
      const deletedSubscription = await stripe.subscriptions.del(
        req.body.subscriptionId
      );
      res.send(deletedSubscription);

    } catch (error) {
      console.log(error);
    }
  });