Webflow + Stripe - save card details for payment intent

Help
#1

Hi there Pipedream community,

My app is hosted on Webflow and I am trying to do the following:
I have a sort of auction app whereby buyers can bid (=make offers) on products. if the offer is accepted, the buyer HAS to pay the bid amount (valid for a set period, say one week). As such, I want to be able to collect buyer’s credit card details when they place bids and charge them if and only if their offer is accepted (manually probably).

The way I have set it up now is to collect bids through a form submission on Webflow. But I struggle with the payment side (Stripe).

I imagine that I need to create a customer and create a payment intent by collecting their card details and only charge the card manually through Stripe if the offer is accepted.

I saw that we could create a Stripe SETUP INTENT (as opposed to payment intent, am I correct?) on Pipedream from a form submission on Webflow. The problem is that there is obviously no credit card details from the Webflow form.

I was thinking of charging the smallest amount possible through a Stripe customer portal integrated on Webflow (50 cents) to have the card’s information saved, but I read that you can only charge the card once on Stripe…

Any idea on how to execute the above? Would be incredible!

I have seen the following on Stripe:

Thanks!!
Elsa

#2

Hi @hello-5c76c7,

Neat idea Elsa, that’s a very cool way of building an auctioning house without much code at all.

Your question is better asked through Stripe’s support channels, this forum is for workflow building and support.

Once you have determined the right Stripe API endpoints for your use case, we can certainly help you integrate them with your Pipedream workflow that connects from Webflow or from Stripe.

I have some past experience with Stripe, but please don’t take this as gospel. You may have issues accepting payments or credit card information through a webflow form because Stripe does not accept credit card data directly.

You need to capture the payment intent through Stripe’s Javascript snippet, which you should be able to include in your Webflow site.

For the functionality on capturing the intent to pay if a customer has won an auction, look into what’s called a “hold” on the credit card.

A hold is a temporary freeze on the funds on a given card so you’re not charging them, but reserving the right to charge that set amount by a given date. Stripe may have a way to do this. But again, I would recommend reaching out to them directly for support regarding those APIs.

Once you have that sorted out, we’re happy to help integrate your workflows with Stripe, Webflow or whatever else you may need.

Best of luck!

#3

Hey @pierce,

Thanks a lot for your helpful response.

I do know which Stripe API endpoint I’d like to use.

Ideally I would like to use The Setup Intents API to set up for future payments (Set up future payments | Stripe Documentation).

If not, the Payment Intents API (through Capture Later) to place a hold on a card just as you suggested can work!

It’s just unclear to me how to go from the Stripe API documentation to Webflow’s integration…

Thanks a lot,
Elsa

#4

Hi morning @hello-5c76c7

I did some digging around Webflow’s documentation. It’s very odd, they have good detailed instructions for integrating with some services like Shopify, but in their Stripe integration docs they just link directly to the Checkout API:

I’m sorry, but it sounds like the problem is the direct connection from Webflow to Stripe, since there are both frontend JS code snippets involved in each of these examples with the Checkout API that the Webflow docs link to.

The most direct route to support might to be to contact Stripe directly, they can help aid you on the right path to take and which endpoints work best with Webflow.