Estoy tratando de integrar Stripe Checkout siguiendo las instrucciones que se dan aquí https://stripe.com/docs/payments/accept-a-payment?integration=checkout para node.
Seguí sus instrucciones al pie de la letra y actualicé la clave API en el ejemplo con una real (de prueba) de mi cuenta.
Estoy usando React en el frontend y express en el backend. He habilitado cors.
La solicitud de React al backend tiene éxito y se inicia una solicitud de verificación previa a la franja. La respuesta de verificación previa de stripe es un 403 y la solicitud real está bloqueada con un error CORS: PreflightMissingAllowOriginHeader
const express = require("express"); const app = express(); const cors = require("cors"); const stripe = require("stripe")( process.env.STRIPE_SECRET_KEY ); app.use( cors({ origin: ["http://localhost:8000", "https://checkout.stripe.com"], }) ); app.post("/create-checkout-session", async (req, res) => { console.log('getting here 1') const session = await stripe.checkout.sessions.create({ payment_method_types: ["card"], line_items: [ { price_data: { currency: "usd", product_data: { name: "T-shirt", }, unit_amount: 2000, }, quantity: 1, }, ], mode: "payment", success_url: "http://localhost:4242/success.html", cancel_url: "http://localhost:4242/cancel.html", }); console.log('getting here 2') res.redirect(303, session.url); }); app.listen(4242, () => console.log(`Listening on port ${4242}!`)); handleClick = () => { const res = fetch(`${process.env.BACKEND_API_URL}/create-checkout-session`, { method: 'POST', headers: { "Content-Type": 'text/html' } }) }Estas son algunas de las cosas que aprendí al intentar depurar esto.
text/plain . (Sí, así es, después de que mi servidor devuelve el 303 con la url de Stripe, Chrome no envía una solicitud de OPCIONES a Stripe)Aquí está el código backend y frontend actualizado, respectivamente, que resolvió el problema
app.post("/create-checkout-session", async (req, res) => { const session = await stripe.checkout.sessions.create({ payment_method_types: ["card"], line_items: [ { price_data: { currency: "usd", product_data: { name: "T-shirt", }, unit_amount: 2000, }, quantity: 1, }, ], mode: "payment", success_url: "http://localhost:8000/success", cancel_url: "http://localhost:8000/cancel", }); res.json({url: session.url}) // <-- this is the changed line }); handleClick = async () => { const res = await fetch(`${process.env.BACKEND_API_URL}/create-checkout-session`, { method: 'POST', headers: { "Content-Type": 'application/json' } }) const body = await res.json() window.location.href = body.url }