fx.bloemendaal

[sand horizon]

Hello! The only reason that error would be thrown is if the API key you're using is invalid. Publishable keys are public, can you share the code where you're setting this key?

[faint snow]

const express = require("express");
const app = express();
const { resolve } = require("path");
// Replace if using a different env file or config
const env = require("dotenv").config({ path: "./.env" });

const stripe = require("stripe")(process.env.STRIPE_SECRET_KEY, {
apiVersion: "2022-08-01",
});

app.use(express.static(process.env.STATIC_DIR));

app.get("/", (req, res) => {
const path = resolve(process.env.STATIC_DIR + "/index.html");
res.sendFile(path);
});

app.get("/config", (req, res) => {
res.send({
publishableKey: process.env.STRIPE_PUBLISHABLE_KEY,
});
});

app.post("/create-payment-intent", async (req, res) => {
try {
const paymentIntent = await stripe.paymentIntents.create({
currency: "EUR",
amount: 1999,
automatic_payment_methods: { enabled: true },
});

// Send publishable key and PaymentIntent details to client
res.send({
  clientSecret: paymentIntent.client_secret,
});

} catch (e) {
return res.status(400).send({
error: {
message: e.message,
},
});
}
});

app.listen(5252, () =>
console.log(Node server listening at http://localhost:5252)
);

[sand horizon]

What about your frontend code?

[faint snow]

import { useEffect, useState } from "react";

import { Elements } from "@stripe/react-stripe-js";
import CheckoutForm from "./CheckoutForm";
import { loadStripe } from "@stripe/stripe-js";

function Payment() {
const [stripePromise, setStripePromise] = useState(null);
const [clientSecret, setClientSecret] = useState("");

useEffect(() => {
fetch("/config").then(async (r) => {
const { publishableKey } = await r.json();
setStripePromise(loadStripe(publishableKey));
});
}, []);

[sand horizon]

The key itself must be wrong then. Maybe it has an extra character? A missing character?

[faint snow]

how can that be if I literally copy by clicking on it on my dasboard?

I tried to copy paste multiple times so, Im quite sure it is correct

[sand horizon]

Can you try this key? This is the public test one we show in the docs when you're not logged in: pk_test_TYooMQauvdEDq54NiTphI7jx

[faint snow]

to be sure: I nee to put quotes around them, right?

[sand horizon]

Not sure I understand, that depends on how you have your environment set up. I will say that in this code: setStripePromise(loadStripe(publishableKey)); the publishableKey variable should contain only the publishable key itself without quotes around it.

[faint snow]

okay I changed the key twice, from yours to mine again

and now it is working; no clue why.. but it works! Many thanks sir!

[sand horizon]

Happy to hear it's working!