diff --git a/client/.env b/client/.env index 8a6c954..62040c4 100644 --- a/client/.env +++ b/client/.env @@ -1,8 +1,11 @@ # Server API de Producción (KOYEB.COM) - REACT_APP_API_URL=https://tu-torias.vercel.app/ +# REACT_APP_API_URL=https://tu-torias.vercel.app/ # Server API de Producción Local -#REACT_APP_API_URL=http://localhost:3001 +REACT_APP_API_URL=http://localhost:3000 + +VITE_API_URL=https://tu-torias.vercel.app +VITE_STRIPE_PUBLIC_KEY=pk_test_51PiHnr2KRPeDwuZFCAB1w7KMHZfqM4C1uQC1Ba9WQncYBSTcgHQGq1bgPgENk5dV0avTNamCENrWiygqkyJrE17F00ZTlNurK1 # Server API de Producción (RENDER.COM) # REACT_APP_API_URL=https:// diff --git a/client/src/PaymentForm.jsx b/client/src/PaymentForm.jsx index 51e0b2f..db39d06 100644 --- a/client/src/PaymentForm.jsx +++ b/client/src/PaymentForm.jsx @@ -10,7 +10,7 @@ const PaymentForm = ({ plan }) => { event.preventDefault(); try { - const response = await axios.post('http://localhost:3000/create-checkout-session', { plan }); + const response = await axios.post(`${import.meta.env.VITE_API_URL}/create-subscription`, { plan }); const sessionId = response.data.id; await stripe.redirectToCheckout({ sessionId }); diff --git a/client/src/SubscriptionPlans.jsx b/client/src/SubscriptionPlans.jsx index 75a49f5..54f24a1 100644 --- a/client/src/SubscriptionPlans.jsx +++ b/client/src/SubscriptionPlans.jsx @@ -3,8 +3,8 @@ import { useNavigate } from 'react-router-dom'; import axios from 'axios'; import { loadStripe } from '@stripe/stripe-js'; -// Accede a la variable de entorno en el momento de la compilación -const stripePromise = loadStripe('pk_test_51PiHnr2KRPeDwuZFCAB1w7KMHZfqM4C1uQC1Ba9WQncYBSTcgHQGq1bgPgENk5dV0avTNamCENrWiygqkyJrE17F00ZTlNurK1'); +const stripePromise = loadStripe(import.meta.env.VITE_STRIPE_PUBLIC_KEY); +const API_URL = import.meta.env.VITE_API_URL; const plans = [ { plan: 'basic', name: 'Plan Básico', price: '$20', features: ['Acceso a clases básicas'] }, @@ -18,11 +18,16 @@ const SubscriptionPlans = () => { const handleSelectPlan = async (plan) => { const stripe = await stripePromise; - const response = await axios.post(`${import.meta.env.VITE_API_URL}/create-checkout-session`, { plan }); - const sessionId = response.data.id; - const { error } = await stripe.redirectToCheckout({ sessionId }); - if (error) { - console.error('Error redirecting to checkout:', error); + console.log(`API URL: ${API_URL}/create-checkout-session`); // Verifica que la URL sea correcta + try { + const response = await axios.post(`${API_URL}/create-checkout-session`, { plan }); + const sessionId = response.data.id; + const { error } = await stripe.redirectToCheckout({ sessionId }); + if (error) { + console.error('Error redirecting to checkout:', error); + } + } catch (error) { + console.error('Error creating checkout session:', error); } }; diff --git a/client/vite.config.js b/client/vite.config.js index 5a33944..c1a884d 100644 --- a/client/vite.config.js +++ b/client/vite.config.js @@ -4,4 +4,7 @@ import react from '@vitejs/plugin-react' // https://vitejs.dev/config/ export default defineConfig({ plugins: [react()], + env: { + REACT_APP_API_URL: process.env.REACT_APP_API_URL, + }, }) diff --git a/server/app.js b/server/app.js index c889cd1..2a20df4 100644 --- a/server/app.js +++ b/server/app.js @@ -1,6 +1,5 @@ import dotenv from 'dotenv'; -dotenv.config(); // Cargar las variables de entorno antes de usarlas - +dotenv.config(); import express from 'express'; import bodyParser from 'body-parser'; import cors from 'cors'; @@ -57,10 +56,11 @@ const plans = { advanced: 'price_1PiI732KRPeDwuZFV3XclDU3', premium: 'price_1PiI7c2KRPeDwuZFU22BMEdq' }; - -app.post('/create-subscription', async (req, res) => { +app.post('/create-checkout-session', async (req, res) => { + console.log('Request received at /create-checkout-session'); // Log para verificar la solicitud try { const { plan } = req.body; + console.log('Plan:', plan); // Log para verificar el plan recibido const session = await stripe.checkout.sessions.create({ payment_method_types: ['card'], line_items: [ @@ -75,10 +75,10 @@ app.post('/create-subscription', async (req, res) => { }); res.json({ id: session.id }); } catch (error) { + console.error('Error creating checkout session:', error); res.status(400).send({ error: { message: error.message } }); } }); - // Configuración de servidor HTTP y socket.io const server = http.createServer(app);