Reputation: 381
I am using the Client integration of Stripe Checkout in my create-react-app
React app.
Purchasing works fine, but it seems like I have no option to search for successful payments or receive relevant information after a payment. (Stripe Checkout Fulfilment Options)
Stripe Checkout is implemented like this:
import React, { Component } from 'react';
const stripe = window.Stripe('INSERT_API_KEY');
class Checkout extends Component {
checkout() {
stripe.redirectToCheckout({
items: [
{plan: 'INSERT_PLAN_ID', quantity: 1}
],
successUrl: 'https://localhost:3000/checkout/success',
cancelUrl: 'https://localhost:3000/checkout/success'
}).then((result) => {
// If `redirectToCheckout` fails due to a browser or network
// error, display the localized error message to your customer
// using `result.error.message`.
console.log(result)
});
}
render() {
return (
<button onClick={this.checkout}>Pay</button>
)
}
}
The success/cancel urls don't help me a lot because I can't think of a security mechanism that would only give access to users who actually made a payment. Do you have any ideas?
Upvotes: 0
Views: 778
Reputation: 3105
Of the options for fulfilling purchases, the most reliable path is to write a backend and use server code. That said, if you feel really strongly about avoiding writing server code, I’d recommend working with a third-party plugin like Zapier to handle successful purchases and sending those into a spreadsheet or another tool that you use to manage fulfillments.
Use Stripe+Zapier to trigger workflows based on common activities in Stripe like getting a new customers, receiving a new payment, and more. https://stripe.com/works-with/zapier
Polling from the client is not recommended for a number of reasons.
Upvotes: 1