Page Not Found

✏️ Editing: client.js

// A reference to Stripe.js initialized with your real test publishable API key.

// CODE:STRIPE
// var stripe = Stripe('pk_test_VLb2CrCzsRuWvarkzoXSFga4'); // Test
var stripe = Stripe('pk_live_71CYbbYvTasOQ4zsv4hlIorL'); // Prod

// The items the customer wants to buy
var nobdc       = document.querySelector('#nobdc').value;
var montant     = document.querySelector('#amount').value;
var nom         = document.querySelector('#name').value;
var email       = document.querySelector('#email').value;

var purchase = {
    items: [{ id: "xl-tshirt",nobdc:nobdc,montant: montant,nom:nom,email:email }]
};
//  Disable the button until we have Stripe set up on the page
document.querySelector("button").disabled = true;

fetch("stripe.php", {
    method: "POST",
    headers: {
        "Content-Type": "application/json"
    },
    body: JSON.stringify(purchase)
})
    .then(function(result) {
        return result.json();
    })
    .then(function(data) {

var elements = stripe.elements();
        var style = {
            base: {
                color: "#32325d",
                fontFamily: 'Arial, sans-serif',
                fontSmoothing: "antialiased",
                fontSize: "16px",
                "::placeholder": {
                    color: "#32325d"
                }
            },
            invalid: {
                fontFamily: 'Arial, sans-serif',
                color: "#fa755a",
                iconColor: "#fa755a"
            }
        };

var card = elements.create("card", { style: style });
        // Stripe injects an iframe into the DOM
        card.mount("#card-element");
        card.on("change", function (event) {
            // Disable the Pay button if there are no card details in the Element
            document.querySelector("button").disabled = event.empty;
            document.querySelector("#card-errors").textContent = event.error ? event.error.message : "";
        });

//
        var form = document.getElementById("payment-form");
        form.addEventListener("submit", function(event) {
            event.preventDefault();

console.log(data);
        // Enregistre la commande
            var nobdc       = document.querySelector('#nobdc').value;
            var nomprenom   = document.querySelector('#name').value;
            var codepromo   = document.querySelector('#description').value;
            var email       = document.querySelector('#email').value;
            const url = 'ajax.php';
            let fetchData = {
                method: 'POST',
                headers: {'Content-Type':'application/x-www-form-urlencoded'}, // this line is important, if this content-type is not set it wont work
                body: 'nocmd='+nobdc+'&nomprenom='+nomprenom+'&codepromo='+codepromo+'&email='+email+'&idc='+data.idc
            }
            fetch(url, fetchData)
                .then(function() {
                    // Handle response you get from the server
                });

// Complete payment when the submit button is clicked
            payWithCard(stripe, card, data.clientSecret);
        });

});

// Calls stripe.confirmCardPayment
// If the card requires authentication Stripe shows a pop-up modal to
// prompt the user to enter authentication details without leaving your page.
var payWithCard = function(stripe, card, clientSecret) {
    var cardholderEmail = document.querySelector('#email').value;

loading(true);
    stripe
        .confirmCardPayment(clientSecret, {
            payment_method: {
                card: card,
                billing_details: {
                    name: cardholderEmail,
                    email: cardholderEmail,
                }
            },

})
        .then(function(result) {
            if (result.error) {
                // Show error to your customer
                //
                //EnregPaye('paiement_ko','');
                //location=('valide.php?ko')
                showError(result.error.message);
            } else {
                // The payment succeeded!

EnregPaye('paiement_ok',result.paymentIntent.id);
                //orderComplete(stripe, result.paymentIntent.id);
                var nobdc    = document.querySelector('#nobdc').value;
                var amount    = document.querySelector('#amount').value;
                location=('thank-you?ok&noc='+nobdc+'&amount='+amount)
                //console.log(result);

}
        });
};

function EnregPaye ( etat , id) {
    var nobdc    = document.querySelector('#nobdc').value;

const url = 'ajax.php';
    let fetchData = {
        method: 'POST',
        headers: {'Content-Type':'application/x-www-form-urlencoded'}, // this line is important, if this content-type is not set it wont work
        body: 'action=enregpaye&nocmd='+nobdc+'&etat='+etat+'&id='+id
    }
    fetch(url, fetchData)
        .then(function() {
            // Handle response you get from the server
        });
}

/* ------- UI helpers ------- */
// Shows a success message when the payment is complete
var orderComplete = function(paymentIntentId) {
    console.log(paymentIntentId);
    loading(false);
    document
        .querySelector(".result-message a")
        .setAttribute(
            "href",
            "https://dashboard.stripe.com/test/payments/" + paymentIntentId
        );
    document.querySelector(".result-message").classList.remove("hidden");
    document.querySelector("button").disabled = true;
};

var orderComplete_old = function(stripe, clientSecret) {
    stripe.retrieveSetupIntent(clientSecret).then(function(result) {
        var setupIntent = result.setupIntent;
        var setupIntentJson = JSON.stringify(setupIntent, null, 2);

document.querySelector(".sr-payment-form").classList.add("hidden");
        document.querySelector(".sr-result").classList.remove("hidden");
        document.querySelector("pre").textContent = setupIntentJson;
        setTimeout(function() {
            document.querySelector(".sr-result").classList.add("expand");
        }, 200);

loading(false);
    });
};

// Show the customer the error from Stripe if their card fails to charge
var showError = function(errorMsgText) {
    loading(false);
    var errorMsg = document.querySelector("#card-errors");
    errorMsg.textContent = errorMsgText;
    setTimeout(function() {
        errorMsg.textContent = "";
    }, 4000);
};
// Show a spinner on payment submission
var loading = function(isLoading) {
    if (isLoading) {
        // Disable the button and show a spinner
        document.querySelector("button").disabled = true;
        document.querySelector("#spinner").classList.remove("hidden");
        document.querySelector("#button-text").classList.add("hidden");
    } else {
        document.querySelector("button").disabled = false;
        document.querySelector("#spinner").classList.add("hidden");
        document.querySelector("#button-text").classList.remove("hidden");
    }
};

Sid Gifari From Gifari Industries - BD Cyber Security Team