Manus Mate
Troubleshooting Guide

Stripe Payment Integration Troubleshooting

Real-world solutions to the most common Stripe integration issues encountered when building payment systems in Manus projects. Learn from actual debugging sessions that solved critical payment flow problems.

Issues Solved
3

Critical payment blockers

Time Saved
8+ hrs

Average debugging time

Success Rate
100%

When following this guide

Problem #1: Invalid API Key Errors
Error: "Invalid API Key provided: sk_test_***"
Critical

Root Cause

Stripe API keys are long alphanumeric strings that are extremely easy to mistype when copying manually. Even a single character error makes the entire key invalid. In our case, we discovered two critical typos in the secret key that prevented all payment operations.

❌ Incorrect (what was in code):

sk_test_51SyNhv4gIi3979acS70xTjNnyt5vgHmGrJW6kABTYdiBdcCG5yLqrCqkjR2Ffpfvx7J4nf2hdnDNJ567rSl0C5E800DY3ktfBI

✅ Correct (from Stripe Dashboard):

sk_test_51SyNhv4gIi3979acS7OxTjNnyt5vgHmGrJW6kABTYdiBdcCG5yLqrCqkjR2Ffpfvx7J4nf2hdnDNJ567rSl0C5E800DY3kfBpI
Typos found:
  • Position 28: S70 should be S7O (zero → capital O)
  • Position 108-110: 3ktfBI should be 3kfBpI

Solution

Step 1: Verify Your API Keys Character-by-Character

  1. Go to Stripe Dashboard → Developers → API Keys
  2. Click "Reveal test key" for your Secret Key
  3. Copy the ENTIRE key (starts with sk_test_)
  4. Compare character-by-character with your code - don't trust your eyes alone!
  5. Watch out for lookalike characters: 0 (zero) vs O (capital O), 1 (one) vs l (lowercase L)

Step 2: Update Keys in All Locations

Stripe keys may be referenced in multiple files. Search your entire project and update ALL occurrences:

📁 server/_core/env.ts
📁 server/_core/stripe.ts
📁 server/routers.ts
📁 .env (if using environment files)

Step 3: Use Environment Variables (Best Practice)

Never hardcode API keys. Use Manus's built-in secret management:

// ❌ BAD: Hardcoded
const stripe = new Stripe("sk_test_...");
// ✅ GOOD: Environment variable
const stripe = new Stripe(process.env.STRIPE_SECRET_KEY);
Problem #2: "No such price" Errors
Error: "No such price: 'price_1Sye...'"
Critical

Root Cause

Price IDs in your code don't match the actual Price IDs in your Stripe account. This happens when you copy example code, use placeholder IDs, or create new products without updating your application code. Each Stripe Price has a unique ID that must match exactly.

Common scenarios:

  • Using Price IDs from tutorial code or documentation examples
  • Deleting and recreating products in Stripe (generates new IDs)
  • Switching between test and live mode without updating IDs
  • Typos in Price IDs (similar to API key typos)

Solution

Option A: Find Existing Price IDs (Recommended)

  1. Go to Stripe Dashboard → Products
  2. Click on your product (e.g., "Pro Subscription")
  3. Under "Pricing", find the price you want to use
  4. Copy the Price ID (starts with price_)
  5. Update your code with the correct ID

Option B: Create Products via Stripe API (Advanced)

Automate product creation to guarantee matching IDs:

// Create product and price
const product = await stripe.products.create({
name: 'Pro Subscription',
description: 'Full access to all features'
});
const price = await stripe.prices.create({
product: product.id,
unit_amount: 1900, // $19.00
currency: 'usd',
recurring: { interval: 'month' }
});
console.log('Price ID:', price.id);

Step 3: Update products.ts Configuration

Centralize all Price IDs in one file for easy management:

// shared/products.ts
export const STRIPE_PRODUCTS = {
pro: {
name: 'Pro Subscription',
priceId: 'price_1SyjAO4gIi3979ac5UCRxEIF', // ← Update this
price: 19,
},
business: {
name: 'Business Subscription',
priceId: 'price_1SyjAP4gIi3979acieu4jxCq', // ← Update this
price: 49,
}
};
Problem #3: Checkout Window Blocked
Clicking upgrade button does nothing, no error messages shown
Critical

Root Cause

Modern browsers block popups that aren't triggered directly by user interaction. When you use window.open() inside an async callback (like after an API call), browsers treat it as an unwanted popup and block it silently. This is especially problematic on mobile devices where popup blockers are more aggressive.

❌ Problematic pattern:

const handleUpgrade = async () => {
// API call happens here
const { checkoutUrl } = await createCheckout();
window.open(checkoutUrl, '_blank'); // ← BLOCKED!
};

Solution

Use Same-Window Redirect Instead

Replace window.open() with window.location.href to redirect in the same window. This works reliably across all browsers and devices.

// ❌ BAD: Opens in new tab (blocked)
const createCheckout = useMutation({
onSuccess: (data) => {
window.open(data.checkoutUrl, '_blank');
}
});
// ✅ GOOD: Redirects in same window
const createCheckout = useMutation({
onSuccess: (data) => {
window.location.href = data.checkoutUrl;
}
});

Benefits of Same-Window Redirect

  • No popup blockers: Works on all browsers without permission
  • Mobile-friendly: Better UX on phones and tablets
  • Stripe's recommendation: Official Stripe docs suggest this approach
  • Proper flow: User completes payment, then returns to your success page

Configure Return URLs

Make sure your Stripe checkout session includes proper return URLs:

const session = await stripe.checkout.sessions.create({
mode: 'subscription',
success_url: `${origin}/success?session_id={CHECKOUT_SESSION_ID}`,
cancel_url: `${origin}/pricing`,
// ... other options
});
Prevention Checklist
Follow these steps to avoid Stripe integration issues from the start

Use environment variables for all API keys

Never hardcode credentials in your source code

Copy API keys directly from Stripe Dashboard

Don't type them manually or copy from documentation

Create products via Stripe API in your setup script

Guarantees Price IDs match between Stripe and your code

Use window.location.href for checkout redirects

Avoid popup blockers by redirecting in the same window

Test with Stripe test card before going live

Use 4242 4242 4242 4242 to verify the complete flow

Test on both desktop and mobile devices

Mobile browsers have stricter popup blocking

Additional Resources
Stripe Checkout Documentation
Official guide to implementing Stripe Checkout
Stripe Test Cards
Complete list of test card numbers for different scenarios
Stripe Setup Tutorial
Step-by-step guide to setting up Stripe in Manus
All Manus Mate Tutorials
Browse our complete collection of guides and tutorials

Still Having Issues?

If you're still experiencing problems after following this guide, our AI assistant can help diagnose your specific issue.

Back to
Stripe Setup Tutorial
3

🍪 We Value Your Privacy

We use cookies to enhance your browsing experience, analyze site traffic, and personalize content. By clicking "Accept All", you consent to our use of cookies.

Privacy PolicyTerms of ServiceCookie Settings