skip to Main Content

I have setup a front end using react that takes some data and will, with graphql, create objects in a aws dynamo database using amplify. I now have had to include stripe payments into the application. Once a user enters data I would like to charge them using stripe, then once a successful payment has been made I would like to use the data they provided on the react inputs to create a corresponding item in the dynamo database (only if the payment was successful).

I have setup a stripe webhook to hit a lambda function which has access to the graphql api so can create an object in the DB I just cant think how to get the object built from the react front end to be included so it can be used to build the object in the Dynamo DB?

What would be the best way to go about this? Thanks 🙂

2

Answers


  1. The way I see it, you have two options depending on the type of data provided via the React inputs (I believe the second option will work better to keep you flexible):

    API Metadata

    Use this option if the data provided by users is not sensitive. Stripe supports appending metadata to your requests as key-value pairs. This metadata is then added to the `Charge` object created by your `PaymentIntent`, which you can retrieve in your webhook function.

    From the documentation:

    // Set your secret key. Remember to switch to your live secret key in production.
    // See your keys here: https://dashboard.stripe.com/apikeys
    const stripe = require('stripe')('sk_test_CGGvfNiIPwLXiDwaOfZ3oX6Y');
    
    const intent = await stripe.paymentIntents.retrieve('{{PAYMENT_INTENT_ID}}');
    const latest_charge = intent.latest_charge;
    

    The main limitation is, per the documentation,

    You can specify up to 50 keys, with key names up to 40 characters long
    and values up to 500 characters long

    And most importantly, do not store sensitive or PII data here.

    Two-step process

    Alternatively, and probably the solution which will work better for you, you can add a step to the payment process:

    1. Create the object with the React inputs in your database by adding an endpoint in your Amplify code. Add a field to this object such as fulfilled and set it to false.
    2. Your webhook has to update this item when the payment is fulfilled.
    Login or Signup to reply.
  2. It is a simple addition to your code, you can make use of Stripe’s metadata for tracking and managing additional information about your transactions and customers.

    It (metadata) is basically a key-value pair, which will perfectly suit your requirements here.

    metadata sample code:

        "metadata": {
        "order_id": "6735",
        "customer_id": "CUST12345",
        "product_category": "electronics",
        "delivery_date": "2024-07-25",
        "affiliate_code": "AFF2024"
      }
    

    You can use it with paymentintents, checkouts, subscriptions etc.

    Let me know if you need any help further here.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search