Proxy error: Could not proxy request /create-checkout-session from localhost:3000 to http://localhost:3000/ (ECONNREFUSED).
This is the error that I am getting above. I currently am following this guide on stripe: https://stripe.com/docs/checkout/quickstart#run-server using React and Node.js
I currently have a server.js file and a react component which acts as the checkout page
server.js
//server.js
const stripe = require('stripe')(
process.env.NEXT_PUBLIC_STRIPE_API_KEY
);
const express = require('express');
const app = express();
app.use(express.static('public'));
const YOUR_DOMAIN = 'http://localhost:3000';
app.post('/create-checkout-session', async (req, res) => {
const session = await stripe.checkout.sessions.create({
line_items: [
{
// Provide the exact Price ID (for example, pr_1234) of the product you want to sell
price: process.env.NEXT_PUBLIC_STRIPE_PRICE_ID,
quantity: 1,
},
],
mode: 'payment',
success_url: 'https://localhost:3000/success',
cancel_url: 'https://localhost:3000/cancel',
});
res.redirect(303, session.url);
});
app.listen(3000, () => console.log('Running on port 3000'));
CheckoutPage.jsx
//checkoutpage
import React, { useState, useEffect } from "react";
const ProductDisplay = () => (
<section>
<div>
<img
src="https://i.imgur.com/EHyR2nP.png"
alt="The cover of Stubborn Attachments"
/>
<div>
<h3>Stubborn Attachments</h3>
<h5>$20.00</h5>
</div>
</div>
<form action="/create-checkout-session" method="POST">
<button type="submit">
Checkout
</button>
</form>
</section>
);
const Message = ({ message }) => (
<section>
<p>{message}</p>
</section>
);
const CheckoutPage = () => {
const [message, setMessage] = useState("");
useEffect(() => {
// Check to see if this is a redirect back from Checkout
const query = new URLSearchParams(window.location.search);
if (query.get("success")) {
setMessage("Order placed! You will receive an email confirmation.");
}
if (query.get("canceled")) {
setMessage(
"Order canceled -- continue to shop around and checkout when you're ready."
);
}
}, []);
return message ? (
<Message message={message} />
) : (
<ProductDisplay />
);
}
export default CheckoutPage
I am thinking that something is wrong with the following code on the chekcoutpage.jsx file when trying to use this form element ` Checkout
`I am expecting the button I press in the checkoutpage to redirect me to the prebuilt stripe checkout page for my product I have already set up my product in the stripe dashboard and got the necessary tokens in env file
I need help with getting the proxy to work
I tried adding "proxy": "http://localhost:3000/", in package.json file located in front end but it was not working