donejeh_api

[blazing elk]

👋 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/1301860247945871361

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

[severe wren]

Hi, let me help you with this.

[hollow vessel]

<!-- Payment Form -->
<form id="payment-form">
<div id="payment-element"></div>
<button id="submit-button" type="submit">Pay</button>
</form>

<script src="https://js.stripe.com/v3/"></script>
<script>
const stripe = Stripe('pk_test_51O6dc7ExzaeyBHyO8yLgl6PVk8pcKmYEocs1fDZX4pYEiZFGNpBs8ka6NL4I5GPmDccJ1u1G5n0H4lGvnlxiXB5y00DDs1LunM'); // Replace with your publishable key

async function initializePayment() {
    // Fetch clientSecret from your backend

    const clientSecret  = 'pi_3QGILVExzaeyBHyO1KzbWgTC_secret_4T8te75iWgsC5VwToDiCeNLMN'

    // Initialize elements with clientSecret
    const elements = stripe.elements({ clientSecret });
    const paymentElement = elements.create('payment');
    paymentElement.mount('#payment-element');

    // Handle form submission
    const form = document.getElementById('payment-form');
    form.addEventListener('submit', async (event) => {
        event.preventDefault();
        const { error } = await stripe.confirmPayment({
            elements,
            confirmParams: {
                return_url: 'https://your-site.com/order-confirmation',
            },
        });

        if (error) {
            console.error('Payment failed:', error.message);
        } else {
            console.log('Payment successful');
        }
    });
}

initializePayment();

</script>

[severe wren]

Have you enabled Klarna in your Dashboard?

It seems to be enabled on your PaymentIntent though.

  payment_method_types: [
    "card",
    "klarna",
    "link",
    "cashapp",
  ],

Not sure how this is possible. Do you have a link the reproduce the issue?

[marble crag]

there can be filtering based on your own location and the country of your Stripe account : https://docs.stripe.com/payments/klarna#:~:text=United States-,If you’re based,-in the EEA

in your example this is a US Stripe account so this applies:

If you’re based outside the EEA, UK, or Switzerland, then you can only transact with customers within your country, and the presentment currency must be the currency of your country
so unless your own browser/IP address is in the US, you won't see Klarna since we filter it out

[hollow vessel]

okay thank you, do you mean i cant test? or can i use VPN ?

[marble crag]

a VPN is an option yes

[hollow vessel]

i have it enable

also if i force Klarna from backend it works fine

[hollow vessel]

if i should use payment_method_types and specify the payment i want it's work fine

[hollow vessel]

{
"data": {
"isSuccess": true,
"clientSecret": "pi_3QGILVExzaeyBHyO1KzbWgTC_secret_4T8te75iWgsC5VwToDiCeNLMN"
}
}

here is clientSecret i generated

here is html and javascript to test

<!-- Payment Form -->
<form id="payment-form">
<div id="payment-element"></div>
<button id="submit-button" type="submit">Pay</button>
</form>

<script src="https://js.stripe.com/v3/"></script>
<script>
const stripe = Stripe('pk_test_51O6dc7ExzaeyBHyO8yLgl6PVk8pcKmYEocs1fDZX4pYEiZFGNpBs8ka6NL4I5GPmDccJ1u1G5n0H4lGvnlxiXB5y00DDs1LunM'); // Replace with your publishable key

async function initializePayment() {
    // Fetch clientSecret from your backend

    const clientSecret  = 'pi_3QGILVExzaeyBHyO1KzbWgTC_secret_4T8te75iWgsC5VwToDiCeNLMN'

    // Initialize elements with clientSecret
    const elements = stripe.elements({ clientSecret });
    const paymentElement = elements.create('payment');
    paymentElement.mount('#payment-element');

    // Handle form submission
    const form = document.getElementById('payment-form');
    form.addEventListener('submit', async (event) => {
        event.preventDefault();
        const { error } = await stripe.confirmPayment({
            elements,
            confirmParams: {
                return_url: 'https://your-site.com/order-confirmation',
            },
        });

        if (error) {
            console.error('Payment failed:', error.message);
        } else {
            console.log('Payment successful');
        }
    });
}

initializePayment();

</script>