#crit5505
last matrix
Hey
olive warren
Hello, happy to help. What are you looking for help with?
olive warren
Gotcha, that sounds like you are not passing in your API key correctly when initializing Stripe.js
Have you checked your initialization code to see what you are passing in for the api key?
olive warren
Your client-side javascript code. Initializaiton looks like this https://stripe.com/docs/js/initializing
last matrix
i downloaded the starter from stripe vs code
olive warren
Good to see that you have this set in that .env file, it sounds like your code may not be pulling the key from your env file properly
last matrix
im following this guide https://www.youtube.com/watch?v=NZvwxAjptaQ
olive warren
Makes sense, have you double checked that your integration is populating this API key correctly?
last matrix
Sorry i did not, how would i double check that?
oh
you mean if it send hte test key and public key correctly?
i am checking rigth now
@olive warren so I am testing right now on a localhost should i put it to my Secret key or Rk_test key aka the CLI key
olive warren
Either should work for server-side code
The secret key probably makes more sense if the restricted key was made specifically for the CLI
last matrix
ok i set it to my normal secret key because its unrestricted
and it still wont work
where would i find the webhook secret
olive warren
I think the first thing to do is to find exactly where this error is coming from. Is your client side code or server-side code throwing this on a specific call?
last matrix
olive warren
The error message says it isn't set to a String, which means that it can't even see what key you are passing in
last matrix
im also wondering if curl is messed up since it wont let me do this
@olive warren any ideas?
olive warren
That looks like a different error. The first error looks like it is coming from Stripe.js, the second one looks like it depends on your command line's version of curl
last matrix
will curl effect it showing up at all or no?
olive warren
No, the webpage won't be affected by your computer's version of curl
olive warren
Look at where your code initializes Stripe.js
last matrix
sorry im not exactly an advanced back end developer where would I find this in the stripe sample
olive warren
It sounds like either node is not populating the key properly or you are not passing the key variable in properly to the code where Stripe.js is being initialized clinet side
last matrix
ok
olive warren
Have you considered our low-code options like Checkout? It is a lot less complex to manage https://stripe.com/docs/payments/accept-a-payment
last matrix
Sorry but I am not interested in that.
I need this for specific reasons. Can you please help me out with it?
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: '2020-08-27',
appInfo: { // For sample support and debugging, not required for production:
name: "stripe-samples/<your-sample-name>",
version: "0.0.1",
url: "https://github.com/stripe-samples"
}
});
app.use(express.static(process.env.STATIC_DIR));
app.use(
express.json({
// We need the raw body to verify webhook signatures.
// Let's compute it only when hitting the Stripe webhook endpoint.
verify: function(req, res, buf) {
if (req.originalUrl.startsWith('/webhook')) {
req.rawBody = buf.toString();
}
}
})
);
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) => {
const paymentIntent = await stripe.paymentIntents.create({
amount: 1999,
currency: 'usd',
automatic_payment_methods: { enabled: true }
})
res.send({ clientSecret: paymentIntent.client_secret })
})
// Expose a endpoint as a webhook handler for asynchronous events.
// Configure your webhook in the stripe developer dashboard
// https://dashboard.stripe.com/test/webhooks
app.post('/webhook', async (req, res) => {
let data, eventType;
// Check if webhook signing is configured.
if (process.env.STRIPE_WEBHOOK_SECRET) {
// Retrieve the event by verifying the signature using the raw body and secret.
let event;
let signature = req.headers['stripe-signature'];
try {
event = stripe.webhooks.constructEvent(
req.rawBody,
signature,
process.env.STRIPE_WEBHOOK_SECRET
);
} catch (err) {
console.log(`⚠️ Webhook signature verification failed.`);
return res.sendStatus(400);
}
data = event.data;
eventType = event.type;
} else {
// Webhook signing is recommended, but if the secret is not configured in `config.js`,
// we can retrieve the event data directly from the request body.
data = req.body.data;
eventType = req.body.type;
}
if (eventType === 'payment_intent.succeeded') {
// Funds have been captured
// Fulfill any orders, e-mail receipts, etc
// To cancel the payment after capture you will need to issue a Refund (https://stripe.com/docs/api/refunds)
console.log('💰 Payment captured!');
} else if (eventType === 'payment_intent.payment_failed') {
console.log('❌ Payment failed.');
}
res.sendStatus(200);
});
app.listen(4242, () => console.log(`Node server listening at http://localhost:4242`));
this is the server.js file in the server folder
am i suppose to configure this or change this?
olive warren
We can help you on this server but we can only help so much. Making a custom integration like this is very complicated and will take debugging that is a lot more difficult than this.
And no, that is the server-side code. This error is coming from your client side code
Like the js that your HTML includes that controls the functionality on your webpage
last matrix
chaging the 4th line from const stripe = Stripe(publishablekey) to const stripe = stripe(publishablekey) made errors go away
olive warren
Awesome! Glad you were able to solve that
last matrix
when it was capitalized i was getting other erros tho xd
olive warren
Right, because when it is capitalized the code recognizes Stripe as something that comes from Stripe.js
olive warren
When you lowercase it, the code doesn't recognize it at all, hence the second error
I would reccommend printing out your publishable key on your server before you send it to the client
last matrix
how do i make apiKey a string
olive warren
and to your client before you use it to initialize Stripe.js
last matrix
How do i do that 🤣
Bro im just following the guide on youtube trying to learn and I am not sure how to do this
olive warren
I'm sorry but if you don't know how to print out variables I don't think I can help you debug this.
From your screenshot it looks like you are just passing in the json object that you are fetching from the server rather than getting the key out of the json that you get back
Making your own custom page means you will need to understand what your code is doing and how to debug it when things are going wrong. This server can help with Stripe-specific questions but for basic debugging techniques you will need to learn to help yourself to be able to build this site properly.
neon quarryBOT
last matrix
@olive warren Im not creating my own custom page, im following the youtube guide
bitter hollow
Hi 👋
I'm stepping in as @olive warren has to go
If you are writing the code, you are creating a custom page. It doesn't matter if the source is a YouTube video
We expect people following our videos to understand the code they are writing
last matrix
Sorry, I understand it for the most part and im debugging it but it is telling me its failing to fetch
Specifically its telling me its not fetching here
the videos says to fetch from /config but there is no config directory
bitter hollow
The Fetch API is a browser API used to trigger HTTP requests: https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API
Does your server have a /config endpoint set up?
last matrix
No
I am not 100% sure if I am being honest, I am running from a local host and all the server stuff I downloaded from visual studio stripe starter node
bitter hollow
Okay so you would need to understand both writing JavaScript for the browser and whatever back-end coding language you selected
last matrix
node
bitter hollow
Then are you familiar with writing Node-JS?
last matrix
Not very much, I can get arround it but I am not an advanced developer on it
bitter hollow
I would recommend starting there, to be honest. I've always found the MDN tutorials to be very helpful in getting a solid understanding of server-side code: https://developer.mozilla.org/en-US/docs/Learn/Server-side/Express_Nodejs/Introduction
last matrix
Brother I am just trying to follow the tutorial on youtube
bitter hollow
Right, and to follow that tutorial we recommend you be comfortable building webpages using Node-JS and writing your own JavaScript code for the browser
last matrix
There is nothing in the tutorial about a /config endpoint
is that required and if so is there a tutorial?
if not can you walk me through how to make it?
bitter hollow
The config endpoint is in the code you shared earlier
I strongly recommend you review how to build Express web-servers
last matrix
No thanks, not exactly interested in learning how to code Just want to learn how to get this working
bitter hollow
Getting this working will require knowing how to code