V0 stripe payment integration using existing account

Hi,
I’m using the stripe payment integration in Sandbox and would like to change the payment configuration to also accept Paypal etc.
But I’m not allowed to do this yet in Stripe and I don’t see an option to change it in vercel/v0. I also don’t have the option to use an existing stripe account with my project, or I don’t know how to do it.
Can someone help please?

You can totally use your existing Stripe account with your v0 projects!

  1. Grab your Stripe API keys → In your Stripe dashboard, go to Developers → API keys and copy your publishable key and secret key
  2. Add the keys to your project → In your Next.js project, drop them into your .env.local file:
NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY=pk_test_...
STRIPE_SECRET_KEY=sk_test_...
  1. Install Stripe
npm install stripe @stripe/stripe-js

You can do this on v0 directly from the editor, or prompt it to follow the instructions above.

If you want PayPal, Apple Pay, Google Pay, etc., you just need to enable them in Stripe:

  1. In your Stripe dashboard, go to Settings → Payment methods
  2. Toggle on whatever you want to support

Some helpful documentation:

Thanks for your quick replay :slight_smile:
I currently have a sandbox running but I can change the infos about the NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY and STRIPE_SECRET_KEY in the env variables on v0 or Vercel but that didn’t change which sandbox was connected to the specific project.
And in the existing sandbox I can’t change the NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY and STRIPE_SECRET_KEY in env.local in Vercel.
Am I missing something?

@pawlean Thanks for your quick replay :slight_smile:
I currently have a sandbox running but I can change the infos about the NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY and STRIPE_SECRET_KEY in the env variables on v0 or Vercel but that didn’t change which sandbox was connected to the specific project.
And in the existing sandbox I can’t change the NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY and STRIPE_SECRET_KEY in env.local in Vercel.
Am I missing something?

I found a solution. This is the steps I took. (I assume precondition is a working sandbox integration from vercel/v0)

I deleted the sandbox in vercel –> that meant it was disconnected also from the v0 project.
In the v0 project I did not install the stripe integration again (even though it asked me to). Instead I manually added the following 3 keys to the environement variabels:
STRIPE_SECRET_KEY

  • Your live Stripe secret key (starts with sk_live_ for production or sk_test_ for test mode)
  • Example: sk_live_xxxxxxxxxxxxxxxxxxxxx
  • Found in: Stripe Dashboard → Developers → API Keys

NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY

  • Your live Stripe publishable key (starts with pk_live_ for production or pk_test_ for test mode)
  • Example: pk_live_xxxxxxxxxxxxxxxxxxxxx
  • Found in: Same location as secret key

STRIPE_PUBLISHABLE_KEY (optional but recommended)

  • Same value as above, just without the NEXT_PUBLIC_ prefix

I then redeployed the app.
After that I let v0 create a script to add a product in stripe (as a test) which worked. I probably could have created the product myself in stripe.
Then let v0 update the product Id and price Id.
And finally I added a different payment configuration.

At the beginning of the process I also signed up for Vercel Pro (but not sure if that made a difference, at least nothing I could see actually changed)

2 Likes