I've finally managed to implement the new Stripe Payment Element in Laravel via the Payment Intents API. However, I now need to capture information about the payments and store them in my database - specifically, I need the following data:

• Transaction ID
• Payment status (failed/pending/successful, etc.)
• Payment method type (card/Google Pay/Apple Pay/etc.)
• The amount actually charged to the customer
• The currency the customer actually paid in
• The postcode entered by the user in the payment form

All of this information seems to be available in the Payment Intent object but none of the several Stripe guides specify how to capture them on the server. I want to avoid using webhooks because they seem like overkill for grabbing and persisting data that I'm already retrieving.

It also doesn't help that, thanks to how the Stripe documentation's AJAX/PHP solution is set up, trying to dump and die any variables on the server-side causes the entire client-side flow to break, stopping the payment form from rendering and blocking any debugging information. Essentially, this makes the entire implementation of Payment Intents API impossible to debug on the server.

Does anyone who's been here before know how I would go about capturing this information?

Relevant portion of JavaScript/AJAX:

const stripe = Stripe(<TEST_PUBLISHABLE_KEY>);
const fonts = [
    {
        cssSrc:
            "https://fonts.googleapis.com/css2?family=Open Sans:wght@300;400;500;600;700&display=swap",
    },
];
const appearance = {
    theme: "stripe",
    labels: "floating",
    variables: {
        colorText: "#2c2c2c",
        fontFamily: "Open Sans, Segoe UI, sans-serif",
        borderRadius: "4px",
    },
};

let elements;
initialize();
checkStatus();
document
    .querySelector("#payment-form")
    .addEventListener("submit", handleSubmit);

// Fetches a payment intent and captures the client secret

async function initialize() {
    const { clientSecret } = await fetch("/payment/stripe", {
        method: "POST",
        headers: {
            "Content-Type": "application/json",
            "X-CSRF-TOKEN": document.querySelector('input[name="_token"]').value,
        },
    }).then((r) => r.json());
    elements = stripe.elements({ fonts, appearance, clientSecret });
    const paymentElement = elements.create("payment");
    paymentElement.mount("#payment-element");
}

async function handleSubmit(e) {
    e.preventDefault();
    setLoading(true);
    const { error } = await stripe.confirmPayment({
        elements,
        confirmParams: {
            // Make sure to change this to your payment completion page
            return_url: "http://localhost.rc/success"
        },
    });

    if (error.type === "card_error" || error.type === "validation_error") {
        showMessage(error.message);
    } else {
        showMessage("An unexpected error occured.");
    }
    setLoading(false);
}

// Fetches the payment intent status after payment submission
async function checkStatus() {
    const clientSecret = new URLSearchParams(window.location.search).get(
        "payment_intent_client_secret"
    );
    if (!clientSecret) {
        return;
    }
    const { paymentIntent } = await stripe.retrievePaymentIntent(clientSecret);
    switch (paymentIntent.status) {
        case "succeeded":
            showMessage("Payment succeeded!");
            break;
        case "processing":
            showMessage("Your payment is processing.");
            break;
        case "requires_payment_method":
            showMessage("Your payment was not successful, please try again.");
            break;
        default:
            showMessage("Something went wrong.");
            break;
    }
}

Routes file:

Route::post('/payment/stripe', [TransactionController::class, "stripe"]);

TransactionController:

public function stripe(Request $request) {
    
    Stripe\Stripe::setApiKey(env(<TEST_SECRET_KEY>)); 

    header('Content-Type: application/json');

    try {
       
        $paymentIntent = Stripe\PaymentIntent::create([
            'amount' => 2.99,
            'currency' => 'gbp',
            'automatic_payment_methods' => [
                'enabled' => true,
            ], 

        ]);

        $output = [
            'clientSecret' => $paymentIntent->client_secret,
        ];

        $this->storeStripe($paymentIntent, $output);

        echo json_encode($output);

    } catch (Stripe\Exception\CardException $e) {

    echo 'Error code is:' . $e->getError()->code;

    $paymentIntentId = $e->getError()->payment_intent->id;
    $paymentIntent = Stripe\PaymentIntent::retrieve($paymentIntentId);

    } catch (Exception $e) {

        http_response_code(500);
        echo json_encode(['error' => $e->getMessage()]);

    }
}

How can I capture the above information from the Payment Intent to store in my database?

CodePudding user response：

I know you're not going to like this but I'll say it anyway. I honestly think implementing a webhook endpoint, listener and receiver function is your best bet and here is why:

The Stripe Payment Intent captures the lifecycle of a payment as it moves through multiple states. Because the various payment networks outside of Stripe do not guarantee specific response times these transitions can be asynchronous.

Therefore you cannot be certain when is the appropriate time to query the API for your completed Payment Intent unless you are listening for the payment_intent.succeeded event. Additionally, in some cases payment methods can be declined well after initial processing (e.g. suspected fraudulent cards, etc.). Using the webhooks approach keeps you informed of these changes.

Lastly, while you may only care to store this data in your DB now, scope does tend to increase and implementing webhook listeners early means you will have a solution ready if you need to take additional actions like

• Sending email notifications to your customers
• Adjusting revenue reconciliation
• processing fulfillment actions
• Other stuff.....