#ak_embedded-checkout-php

1 messages · Page 1 of 1 (latest)

rocky larkBOT
#

👋 Welcome to your new thread!

⏲️ We'll be here soon! Typically we respond in a few minutes, but sometimes we might take a bit longer if the server is busy or if you have a particularly tricky question.

⏱️ We close idle threads, which makes them read-only. Once a thread is closed it won't be reopened, but you can always start a new thread if you have another question.

🔗 This thread will always be available, even after it's closed. You can find it again using Discord's search, or you can save this link: https://discord.com/channels/841573134531821608/1263210933216608358

📝 Have more to share? Add more details, code, screenshots, videos, etc. below.

quartz jettyBOT
#

Below are links to other discussions we've had with you in the past week in case you want to review that information. If your question is related to one of these previous discussions, please provide a comprehensive summary of the current state and what you need help with now. We help many users simultaneously, so a summary allows us to resolve your issue as soon as possible.

  • ak_code, 3 hours ago, 11 messages
  • ak_api, 5 hours ago, 75 messages
  • ak_code, 23 hours ago, 50 messages
jovial sierra
#

Hello

fervent ingot
#

Hello

jovial sierra
#

You are asking if your site is required to have an SSL Cert?

fervent ingot
#

The last point continuation - This is the error message I want to get rid off

Screenshot_2024-07-18_at_12.24.15_AM.png
#

Do I still need While my website is https: already and the stripe embedded form will open on the same domain i.e. https://hor.co.in/ (my website) do I need to have an SSL. Cuz, There's no redirection or exiting the domain the form will open on the same domain.

jovial sierra
#

First, that error isn't coming from us.

fervent ingot
#

Yes, It isn't

jovial sierra
#

That looks to be a Chrome error afaict

#

It is possible that a redirect could occur if you support payment method types that require a redirect

#

But really as long as you serve over HTTPS that is all we explicitly require

fervent ingot
#

Okay, I get It

#

So, If Iget the SSL certification will this error disappear ? shown in the image

#

Also, Will I be able to Apple Pay, Gpay, etc

jovial sierra
#

Yeah it should. You can't serve over HTTPS without an SSL Cert so I don't really understand what you mean by the above to begin with.

fervent ingot
#

Actually, Now that it is not secure that's why It's not showing the payment methods ?

jovial sierra
#

Apple Pay and Google Pay will only display when served over HTTPS

#

Other payment methods should show up on localhost if they are turned on and requirements for those payment method types are met

fervent ingot
#

Thank you so much

#

Brother now that you helped me to understand

#

One sec I'll share Image

#

Please help with which one is best option

jovial sierra
#

I can't help you with that. I can only help with questions about Stripe's API

fervent ingot
#

But, You might know right.., People using stripe embedded form get the ssl recommended by stripe

jovial sierra
#

You shouldn't need to pay for SSL... you should be able to use something like CertBot which provides this for free

#

The options above are all doing extra things

#

Which I can't advise on

#

If you want those things then you can decide

fervent ingot
jovial sierra
#

No, sorry, that's not what this server is for.

#

I can help with integration questions about Stripe's API

#

You need to handle the rest of your development process.

fervent ingot
#

😔 Ok

#

No problem brother, Other query I had was, Do I need to add any extra code to enable Adaptive Pricing on Embedded Form

jovial sierra
#

Nope, you should be able to turn that on from your Dashboard

fervent ingot
#

Perfect, One more thing

#

I have this code in checkout.php file : <?php

require_once '../vendor/autoload.php';
require_once '../secrets.php';

$stripe = new \Stripe\StripeClient($stripeSecretKey);
header('Content-Type: application/json');

$YOUR_DOMAIN = 'https://localhost:4242';

$checkout_session = $stripe->checkout->sessions->create([
'ui_mode' => 'embedded',
'customer_email' => 'customer@example.com',
'submit_type' => 'donate',
'billing_address_collection' => 'required',
'shipping_address_collection' => [
'allowed_countries' => ['*'],
],
'line_items' => [[
# Provide the exact Price ID (e.g. pr_1234) of the product you want to sell
'price' => 'price_1PcXUlSEhVjYU2OjEdpddTgH',
'quantity' => 1,
]],
'mode' => 'payment',
'return_url' => $YOUR_DOMAIN . '/return.html?session_id={CHECKOUT_SESSION_ID}',
]);

echo json_encode(array('clientSecret' => $checkout_session->client_secret));

#

But, I don't see the output as the code is

jovial sierra
#

Not sure what "I don't see the output as the code is" means...?

fervent ingot
#

I mean, The code has : 'customer_email' => 'customer@example.com',
'submit_type' => 'donate',
'billing_address_collection' => 'required',
'shipping_address_collection' =>

#

But, In the form i don't see this

jovial sierra
#

Can you share the client secret used for rendering that Checkout Session?

fervent ingot
#

Sure

#

initialize();

// Create a Checkout Session
async function initialize() {
const fetchClientSecret = async () => {
const response = await fetch("/create-checkout-session", {
method: "POST",
});
const { clientSecret } = await response.json();
return clientSecret;
};

const checkout = await stripe.initEmbeddedCheckout({
fetchClientSecret,
});

// Mount Checkout
checkout.mount('#checkout');
}

jovial sierra
#

Can you log out clientSecret there

#

And then provide me that value?

fervent ingot
#

Okay

#

I see this in console

jovial sierra
#

That indicates a network issue

#

You aren't able to hit your backend and get the expected response

#

So first thing to do is to make sure you can hit your backend endpoint at all

#

Then handle the Stripe stuff

fervent ingot
#

I see, How do I fix it

jovial sierra
#

You need to make sure you can successfully make a fetch request to your backend. Once again, you are the developer here and you need to build your own integration. I can't do this for you.

fervent ingot
#

Got It Boss, Will fix it

#

Trying to get Client secret in console

fervent ingot
#

On It, Getting this error in console : checkout.js:35 Error initializing Checkout: fetchClientSecret is not defined

jovial sierra
#

fetchClientSecret() is your own function, right?

#

Are you calling it before initializing it?

#

Can you show me your current client-side code?

fervent ingot
#

Yes, fetchClientSecret() is a function I defined in my client-side JavaScript code. I'm calling it within the initialize() function to fetch the clientSecret needed for initializing the Stripe Checkout session. Here's my current client-side code:

#

// This is your test secret API key.
const stripe = Stripe("STRIPE_PUBLISHABLE_KEY");

initialize();

// Function to fetch client secret from checkout.php
async function fetchClientSecret() {
try {
const response = await fetch("/checkout.php", {
method: "POST",
});

if (!response.ok) {
  throw new Error(`HTTP error! Status: ${response.status}`);
}

const { clientSecret } = await response.json();
console.log("Client Secret:", clientSecret);
return clientSecret;

} catch (error) {
console.error("Error fetching client secret:", error.message);
throw error; // Propagate the error for further handling
}
}

// Initialize Stripe Checkout
async function initialize() {
try {
const clientSecret = await fetchClientSecret();

const checkoutSession = await stripe.checkout.sessions.create({
  payment_method_types: ['card'],
  line_items: [{
    price_data: {
      currency: 'usd',
      product_data: {
        name: 'Your Product Name',
      },
      unit_amount: 2000, // Amount in cents
    },
    quantity: 1,
  }],
  mode: 'payment',
  success_url: 'https://yourdomain.com/success.html',
  cancel_url: 'https://yourdomain.com/cancel.html',
});

console.log("Checkout Session:", checkoutSession);

} catch (error) {
console.error("Error initializing Checkout:", error.message);
// Handle errors as needed
}
}

rocky larkBOT
#

🧑‍💻 How to format code on Discord

Inline code: wrap in single backticks (`)

This:

The variable `foo` contains the value `bar`.

Will turn into this:

The variable foo contains the value bar.

Code blocks: wrap in three backticks (```)

Also, you can specify the language after the first three backticks to get syntax highlighting.

This:

```javascript
function foo() {
return 'bar';
}
```

Will turn into this:

function foo() {
  return 'bar';
}```

Notes about **code blocks**:
- Specifying the language is optional (e.g., you can omit `javascript` in the example above)
  - If you don't specify the language you won't get syntax highlighting
- When you're inside a code block (after you type \`\`\`) the `Return`/`Enter` key will add a new line instead of sending your message
  - Once you end the code block `Return`/`Enter` works normally again

You can [read more about message formatting on Discord's website.](https://support.discord.com/hc/en-us/articles/210298617)
jovial sierra
#

Alright well not sure just from that snippet why you would get an error saying fetchClientSecret() is undefined

fervent ingot
#

Don't know, Here's a complete view of my client-side JavaScript:

#

checkout.js

#

// This is your test secret API key.
const stripe = Stripe("pk_test_51MXeRzSEhVjYU2OjD85LxZ74ZeDsRqYL9EFIpnB8gJgsYRWoYJbgbjp7qm2MIoMn2nDff61pO7rdRqNs61rMneuS00jAdv6yKc");

initialize();

// Function to fetch client secret from checkout.php
async function fetchClientSecret() {
try {
const response = await fetch("http://localhost:4242/checkout.php", {
method: "POST",
});

if (!response.ok) {
  throw new Error(`HTTP error! Status: ${response.status}`);
}

const { clientSecret } = await response.json();
console.log("Client Secret:", clientSecret);
return clientSecret;

} catch (error) {
console.error("Error fetching client secret:", error.message);
throw error; // Propagate the error for further handling
}
}

// Initialize Stripe Embedded Checkout
async function initialize() {
try {
const clientSecret = await fetchClientSecret();

const checkout = await stripe.embeddedCheckout.createCheckout({
  fetchClientSecret,
});

// Mount Checkout
checkout.mount('#checkout');

} catch (error) {
console.error("Error initializing Checkout:", error.message);
// Handle errors as needed
}
}

#

checkout.php

#

<?php

require_once '../vendor/autoload.php';
require_once '../secrets.php'; // Ensure $stripeSecretKey is defined here

$stripe = new \Stripe\StripeClient($stripeSecretKey);
header('Content-Type: application/json');

$YOUR_DOMAIN = 'https://localhost:4242'; // Adjust as per your domain configuration

$checkout_session = $stripe->checkout->sessions->create([
'ui_mode' => 'embedded',
'customer_email' => 'customer@example.com',
'submit_type' => 'donate',
'billing_address_collection' => 'required',
'shipping_address_collection' => [
'allowed_countries' => ['*'],
],
'line_items' => [[
# Provide the exact Price ID (e.g. pr_1234) of the product you want to sell
'price' => 'price_1PcXUlSEhVjYU2OjEdpddTgH',
'quantity' => 1,
]],
'mode' => 'payment',
'success_url' => $YOUR_DOMAIN . '/return.html?session_id={CHECKOUT_SESSION_ID}',
'cancel_url' => $YOUR_DOMAIN . '/cancel.html',
]);

echo json_encode(array('clientSecret' => $checkout_session->client_secret));

rocky larkBOT
atomic zealot
#

Hi 👋

I'm stepping in as my colleague needs to go. Give me a minute to get caught up

fervent ingot
#

Sure

atomic zealot
#

Okay so can you get your checkout session client secret to your client side and logged successfully?

fervent ingot
#

Nope

#

This is what I get in console : checkout.js:9

   POST http://localhost:4242/checkout.php 404 (Not Found)

fetchClientSecret @ checkout.js:9
initialize @ checkout.js:29
(anonymous) @ checkout.js:4Understand this error
checkout.js:21 Error fetching client secret: HTTP error! Status: 404
fetchClientSecret @ checkout.js:21
await in fetchClientSecret (async)
initialize @ checkout.js:29
(anonymous) @ checkout.js:4Understand this error
checkout.js:38 Error initializing Checkout: HTTP error! Status: 404

atomic zealot
#

Okay, that looks like your PHP server isn't serving your function at that URL

fervent ingot
#

And here is my checkout.php code. : // This is your test secret API key.
const stripe = Stripe("pk_test_51MXeRzSEhVjYU2OjD85LxZ74ZeDsRqYL9EFIpnB8gJgsYRWoYJbgbjp7qm2MIoMn2nDff61pO7rdRqNs61rMneuS00jAdv6yKc");

initialize();

// Function to fetch client secret from checkout.php
async function fetchClientSecret() {
try {
const response = await fetch("http://localhost:4242/checkout.php", {
method: "POST",
});

if (!response.ok) {
  throw new Error(`HTTP error! Status: ${response.status}`);
}

const { clientSecret } = await response.json();
console.log("Client Secret:", clientSecret); // Log client secret here
return clientSecret;

} catch (error) {
console.error("Error fetching client secret:", error.message);
throw error; // Propagate the error for further handling
}
}

// Initialize Stripe Embedded Checkout
async function initialize() {
try {
const clientSecret = await fetchClientSecret();

const checkout = await stripe.embeddedCheckout.createCheckout({
  fetchClientSecret,
});

// Mount Checkout
checkout.mount('#checkout');

} catch (error) {
console.error("Error initializing Checkout:", error.message);
// Handle errors as needed
}
}

#

When I use this checkout.js file : // This is your test secret API key.
const stripe = Stripe("pk_test_51MXeRzSEhVjYU2OjD85LxZ74ZeDsRqYL9EFIpnB8gJgsYRWoYJbgbjp7qm2MIoMn2nDff61pO7rdRqNs61rMneuS00jAdv6yKc");

initialize();

// Create a Checkout Session
async function initialize() {
const fetchClientSecret = async () => {
const response = await fetch("/create-checkout-session", {
method: "POST",
});
const { clientSecret } = await response.json();
return clientSecret;
};

const checkout = await stripe.initEmbeddedCheckout({
fetchClientSecret,
});

// Mount Checkout
checkout.mount('#checkout');
} It opens the form

atomic zealot
#

Why are you sharing this?

#

I don't think it relates

fervent ingot
#

Ok

atomic zealot
#

It sounds like the first thing you need to fix is /checkout.php

#

Currently that isn't being found

#

So the first step is to identify why your PHP server isn't handling web traffic at that URL

fervent ingot
#

Okay