Documentation Index
Fetch the complete documentation index at: https://docs.fype.dev/llms.txt
Use this file to discover all available pages before exploring further.
Tutorial: E-commerce Integration (Next.js)
This tutorial demonstrates how to integrate Fype into a Next.js e-commerce application using the Node.js SDK and AI Agents.
1. Environment Setup
Add your Fype keys to .env.local:
FYPE_SECRET_KEY=fype_test_your_key
FYPE_WEBHOOK_SECRET=whsec_your_secret
NEXT_PUBLIC_BASE_URL=http://localhost:3000
2. Create a Payment API Route
Ask your AI Agent (e.g., Gemini or Cursor):
“Create a Next.js API route /api/checkout that uses the @fype/nodejs-sdk to create a payment. It should take a productId from the request body, look up the price in a local map, and return the checkout_url from Fype.”
Example Implementation:
import { Fype } from '@fype/nodejs-sdk';
const fype = new Fype({ apiKey: process.env.FYPE_SECRET_KEY! });
export async function POST(req: Request) {
const { productId } = await req.json();
const price = getPrice(productId); // Your logic
const payment = await fype.payments.create({
amount: price * 100, // Convert to paise
currency: 'INR',
customer_email: 'user@example.com',
success_url: `${process.env.NEXT_PUBLIC_BASE_URL}/success?id={PAYMENT_ID}`,
cancel_url: `${process.env.NEXT_PUBLIC_BASE_URL}/cart`,
reference_id: `order_${Date.now()}`,
});
return Response.json({ url: payment.checkout_url });
}
const handleBuy = async () => {
const res = await fetch('/api/checkout', {
method: 'POST',
body: JSON.stringify({ productId: 'shirt_123' }),
});
const { url } = await res.json();
window.location.href = url; // Redirect to Fype Checkout
};
4. Secure Webhook Listener
Ask your AI Agent:
“Create a Next.js API route /api/webhooks/fype that listens for POST requests. It must verify the Fype signature using the raw body. If the event is payment.succeeded, log the successful payment ID.”
Example Implementation:
import { Fype } from '@fype/nodejs-sdk';
import { buffer } from 'stream/consumers';
const fype = new Fype({ apiKey: process.env.FYPE_SECRET_KEY! });
export async function POST(req: Request) {
const rawBody = await req.text();
const signature = req.headers.get('x-fype-signature')!;
try {
// Throws if invalid
fype.webhooks.verifySignature(
rawBody,
signature,
process.env.FYPE_WEBHOOK_SECRET!
);
const event = JSON.parse(rawBody);
if (event.type === 'payment.succeeded') {
console.log('Payment Success:', event.data.object.id);
// Fulfill the order in your DB
}
return new Response('OK', { status: 200 });
} catch (err) {
return new Response('Webhook Error', { status: 400 });
}
}
5. Testing with Simulator
- Trigger the
handleBuy function.
- You will be redirected to
checkout.fype.dev.
- Click Simulate Success.
- You will be redirected back to your
success_url.
- Check your server logs to see the webhook confirmation.