Giá dựa trên số ghế với các tiện ích bổ sung và liên kết thanh toán

Hướng dẫn này trình bày cách triển khai mô hình định giá theo số lượng chỗ ngồi bằng add-on của Dodo Payments. Bạn sẽ tạo một sản phẩm subscription với các add-on cho những chỗ ngồi bổ sung và tạo payment link với số lượng add-on tùy chỉnh.

Hướng dẫn này sử dụng Node.js và Express. Bạn có thể điều chỉnh code cho framework của mình (Next.js, React, Vue, v.v.) và tùy chỉnh UI để phù hợp với ứng dụng của bạn.

Cuối cùng của hướng dẫn này, bạn sẽ biết cách:

Tạo các sản phẩm đăng ký với giá dựa trên số ghế
Thiết lập các tiện ích bổ sung cho các ghế bổ sung
Tạo liên kết thanh toán với số lượng tiện ích bổ sung tùy chỉnh
Xử lý các phiên thanh toán với số lượng ghế động

Những gì chúng ta đang xây dựng

Hãy tạo một mô hình giá dựa trên số ghế:

Gói cơ bản: $49/tháng cho tối đa 5 thành viên nhóm
Add-on chỗ ngồi: $2/tháng cho mỗi chỗ ngồi bổ sung
Payment Link: Checkout động với số lượng chỗ ngồi tùy chỉnh

Trước khi bắt đầu, hãy đảm bảo bạn có:

Một tài khoản Dodo Payments
Sự quen thuộc cơ bản với TypeScript/Node.js

Bước 1: Tạo Tiện Ích Bổ Sung Ghế Của Bạn

Tạo một add-on đại diện cho các chỗ ngồi bổ sung. Add-on này sẽ được gắn vào subscription cơ bản và cho phép khách hàng mua thêm chỗ ngồi.

Nội dung chúng ta đang xây dựng: Một add-on có giá $2/tháng cho mỗi chỗ ngồi và có thể được thêm vào bất kỳ subscription cơ bản nào.

Navigate to Add-Ons

Trên bảng điều khiển Dodo Payments của bạn, ở lại phần Products
Nhấp vào tab Add-Ons
Nhấp Create Add-On

Điều này sẽ mở biểu mẫu tạo add-on.

Enter add-on details

Điền các giá trị sau cho add-on chỗ ngồi của chúng ta:Tên Add-On: Additional Team SeatMô tả: Add extra team members to your workspace with full access to all featuresGiá: Enter → 2.00Tiền tệ: Phải khớp với tiền tệ của đăng ký cơ bản của bạnDanh mục thuế: Chọn danh mục phù hợp cho sản phẩm của bạn.

Save your add-on

Xem lại tất cả cài đặt của bạn:
- Tên: Additional Team Seat
- Giá: $2.00/tháng
Nhấp vào Create Add-On

Add-on đã được tạo! Add-on chỗ ngồi của bạn giờ có thể được gắn vào các gói đăng ký.

Bước 2: Tạo Sản Phẩm Đăng Ký Cơ Bản Của Bạn

Tạo một sản phẩm subscription cơ bản bao gồm 5 thành viên nhóm. Đây sẽ là nền tảng cho mô hình định giá theo số lượng chỗ ngồi của bạn.

Navigate to Products

Đăng nhập vào bảng điều khiển Dodo Payments của bạn
Nhấp vào Products trong thanh bên trái
Nhấp vào nút Create Product
Chọn Subscription làm loại sản phẩm

Bạn sẽ thấy một biểu mẫu nơi chúng ta sẽ cấu hình gói đăng ký cơ bản.

Fill in the subscription details

Bây giờ chúng ta sẽ nhập các chi tiết cụ thể cho gói cơ bản của mình:Tên sản phẩm: MotionMô tả: Where your team's documentation lives.Giá định kỳ: Enter → 49.00Chu kỳ thanh toán: Select → MonthlyĐơn vị tiền tệ: Chọn đơn vị bạn ưa thích (ví dụ, USD)

Bước 3: Kết Nối Tiện Ích Bổ Sung Với Đăng Ký

Liên kết add-on chỗ ngồi với subscription cơ bản để khách hàng có thể mua thêm chỗ ngồi trong quá trình checkout.

Attach the seat add-on

Gắn add-on vào subscription trong dashboard

Cuộn xuống phần Tiện Ích Bổ Sung
Nhấp Thêm Tiện Ích Bổ Sung
Từ menu thả xuống, chọn tiện ích bổ sung ghế của bạn
Xác nhận rằng nó xuất hiện trong cấu hình đăng ký của bạn

Save subscription changes

Xem lại toàn bộ thiết lập gói đăng ký của bạn:
- Gói cơ bản: $49/tháng cho 5 chỗ ngồi
- Tiện ích bổ sung: $2/tháng cho mỗi chỗ ngồi bổ sung
Nhấp vào Lưu thay đổi

Đã cấu hình mô hình định giá theo số lượng chỗ ngồi! Khách hàng hiện có thể mua gói cơ bản và thêm chỗ ngồi khi cần.

Bước 4: Tạo Payment Link với số lượng Add-on tùy chỉnh

Tạo một ứng dụng Express.js để tạo payment link với số lượng add-on tùy chỉnh. Điều này cho phép bạn linh hoạt tạo các checkout session với bất kỳ số lượng chỗ ngồi bổ sung nào.

Set up your project

Tạo một project Node.js mới và cài đặt các dependency cần thiết:

mkdir seat-based-pricing
cd seat-based-pricing
npm init -y
npm install dodopayments express dotenv
npm install -D @types/node @types/express typescript ts-node

Tạo file tsconfig.json:

{
  "compilerOptions": {
    "target": "ES2020",
    "module": "commonjs",
    "outDir": "./dist",
    "rootDir": "./src",
    "strict": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "forceConsistentCasingInFileNames": true
  }
}

Create your environment file

Tạo file .env với API key của Dodo Payments:

DODO_PAYMENTS_API_KEY=your_actual_dodo_api_key_here

Không bao giờ commit API key của bạn vào version control. Thêm .env vào file .gitignore của bạn.

Implement the checkout session creation

Tạo file src/server.ts với code sau:

// Add this new endpoint for dynamic seat quantities
import 'dotenv/config';
import DodoPayments from 'dodopayments';
import express, { Request, Response } from 'express';

const app = express();

// Initialize the Dodo Payments client
const client = new DodoPayments({
  bearerToken: process.env.DODO_PAYMENTS_API_KEY,
  environment: 'test_mode'
});

async function createCheckoutSession(seatCount: number) {
  try {
    const session = await client.checkoutSessions.create({
      // Products to sell - use IDs from your Dodo Payments dashboard
      product_cart: [
        {
          product_id: 'pdt_7Rl9OWT2Mz4wwUTKz74iZ', // Replace with your actual product ID
          quantity: 1,
          addons: [
            {
              addon_id: 'adn_eKQbNakKrivDpaxmI8wKI', // Replace with your actual addon ID
              quantity: seatCount
            }
          ]
        }
      ],
      
      // Pre-fill customer information to reduce friction
      customer: {
        email: 'steve@example.com',
        name: 'Steve Irwin',
      },
      // Where to redirect after successful payment
      return_url: 'https://example.com/checkout/success',
    });

    // Redirect your customer to this URL to complete payment
    console.log('Checkout URL:', session.checkout_url);
    console.log('Session ID:', session.session_id);
    
    return session;
    
  } catch (error) {
    console.error('Failed to create checkout session:', error);
    throw error;
  }
}

// Example usage in an Express.js route
app.post('/create-checkout/:seatCount', async (req: Request, res: Response) => {
  try {
    const seatCount = parseInt(req.params.seatCount);
    const session = await createCheckoutSession(seatCount);
    // Demo pricing from this tutorial: $49 base + $2 per additional seat
    res.json({ checkout_url: session.checkout_url, total_cost: 49 + seatCount * 2 });
  } catch (error) {
    res.status(500).json({ error: 'Failed to create checkout session' });
  }
});

// Add this line after your other middleware
app.use(express.static('public'));

// Add this route to serve the demo page
app.get('/', (req, res) => {
  res.sendFile(__dirname + '/../public/index.html');
});

app.listen(3000, () => {
  console.log('Server is running on port 3000');
});

Add a simple web interface

Tạo file public/index.html để dễ kiểm thử:

<!DOCTYPE html>
<html>
<head>
    <title>Seat-Based Pricing Demo</title>
    <style>
        body { font-family: Arial, sans-serif; max-width: 600px; margin: 50px auto; padding: 20px; }
        .form-group { margin: 20px 0; }
        label { display: block; margin-bottom: 5px; font-weight: bold; }
        input { width: 100%; padding: 10px; border: 1px solid #ddd; border-radius: 4px; }
        button { background: #007bff; color: white; padding: 10px 20px; border: none; border-radius: 4px; cursor: pointer; }
        button:hover { background: #0056b3; }
        .result { margin-top: 20px; padding: 15px; background: #f8f9fa; border-radius: 4px; }
    </style>
</head>
<body>
    <h1>Seat-Based Pricing Demo</h1>
    <p>Generate checkout links with custom seat quantities:</p>
    
    <div class="form-group">
        <label for="seatCount">Number of Additional Seats:</label>
        <input type="number" id="seatCount" value="3" min="0" max="50">
    </div>
    
    <button onclick="createCheckout()">Generate Checkout Link</button>
    
    <div id="result" class="result" style="display: none;">
        <h3>Checkout Link Generated!</h3>
        <p><strong>Seat Count:</strong> <span id="seatCountDisplay"></span></p>
        <p><strong>Total Cost:</strong> $<span id="totalCost"></span>/month</p>
        <p><strong>Checkout URL:</strong></p>
        <a id="checkoutUrl" href="#" target="_blank">Click here to checkout</a>
    </div>

    <script>
        async function createCheckout() {
            const seatCount = document.getElementById('seatCount').value;
            
            try {
                const response = await fetch(`/create-checkout/${seatCount}`, {
                    method: 'POST'
                });
                
                const data = await response.json();
                
                if (response.ok) {
                    document.getElementById('seatCountDisplay').textContent = seatCount;
                    document.getElementById('totalCost').textContent = data.total_cost;
                    document.getElementById('checkoutUrl').href = data.checkout_url;
                    document.getElementById('result').style.display = 'block';
                } else {
                    alert('Error: ' + data.error);
                }
            } catch (error) {
                alert('Error creating checkout session');
            }
        }
    </script>
</body>
</html>

Đã tạo giao diện web! Bạn hiện có một UI đơn giản để kiểm thử các số lượng chỗ ngồi khác nhau.

Serve static files

Thêm đoạn này vào src/server.ts để serve file HTML:

// Add this line after your other middleware
app.use(express.static('public'));

// Add this route to serve the demo page
app.get('/', (req, res) => {
  res.sendFile(__dirname + '/../public/index.html');
});

Đã cấu hình file tĩnh! Truy cập http://localhost:3000 để xem giao diện demo của bạn.

Bước 5: Kiểm thử triển khai của bạn

Hãy kiểm thử triển khai mô hình định giá theo số lượng chỗ ngồi để đảm bảo mọi thứ hoạt động chính xác.

Start your server

Đảm bảo bạn có file .env với API key chính xác
Cập nhật ID sản phẩm và add-on trong code bằng các giá trị thực từ dashboard Dodo Payments
Khởi động server của bạn:

npx ts-node src/server.ts

Server của bạn sẽ khởi động thành công và hiển thị “Server is running on port 3000”

Test the web interface

Giao diện demo định giá theo số lượng chỗ ngồi

Mở trình duyệt và truy cập http://localhost:3000
Bạn sẽ thấy giao diện demo định giá theo số lượng chỗ ngồi
Thử các số lượng chỗ ngồi khác nhau (0, 3, 10, v.v.)
Nhấp vào “Generate Checkout Link” cho mỗi số lượng
Xác minh rằng các checkout URL được tạo chính xác

Test a checkout session

Tạo một checkout link với 3 chỗ ngồi bổ sung
Nhấp vào checkout URL để mở checkout của Dodo Payments
Xác minh rằng checkout hiển thị:
- Gói cơ bản: $49/tháng
- Chỗ ngồi bổ sung: 3 × 2 dollar = $6/tháng
Hoàn tất giao dịch mua thử nghiệm

Checkout sẽ hiển thị bảng phân tích giá chính xác và cho phép bạn hoàn tất giao dịch mua.

Listen for webhooks and update your database

Giữ database đồng bộ với các thay đổi về subscription và chỗ ngồi bằng cách lắng nghe các webhook event từ Dodo Payments. Webhook thông báo cho backend của bạn khi khách hàng hoàn tất checkout, cập nhật subscription hoặc thay đổi số lượng chỗ ngồi.Làm theo hướng dẫn webhook chính thức của Dodo Payments để xem hướng dẫn từng bước về cách thiết lập webhook endpoint và xử lý event:

Dodo Payments Webhooks Documentation

Tìm hiểu cách tiếp nhận và xử lý an toàn các webhook event để quản lý subscription và chỗ ngồi.

Khắc phục sự cố

Các vấn đề thường gặp và giải pháp tương ứng:

Checkout creation failing

Nguyên nhân có thể:

Product ID hoặc add-on ID không hợp lệ
API key không có đủ quyền
Add-on chưa được liên kết đúng với subscription
Sự cố kết nối mạng

Giải pháp:

Xác minh product ID và add-on ID tồn tại trong dashboard Dodo Payments
Kiểm tra add-on đã được gắn đúng vào subscription
Đảm bảo API key có quyền tạo checkout session
Kiểm thử kết nối API bằng một GET request đơn giản

Chúc mừng! Bạn đã triển khai mô hình định giá theo số lượng chỗ ngồi

Bạn đã tạo thành công hệ thống định giá theo số lượng chỗ ngồi với Dodo Payments. Sau đây là những gì bạn đã hoàn thành:

Base Subscription

Đã tạo sản phẩm subscription với 5 chỗ ngồi đi kèm, giá $49/tháng

Seat Add-ons

Đã cấu hình add-on cho các chỗ ngồi bổ sung với giá $2/tháng cho mỗi chỗ ngồi

Checkout

Đã xây dựng API tạo checkout session với số lượng chỗ ngồi tùy chỉnh

Web Interface

Đã tạo giao diện web đơn giản để kiểm thử các số lượng chỗ ngồi khác nhau

Ví dụ này minh họa một triển khai tối thiểu của mô hình định giá theo số lượng chỗ ngồi. Khi sử dụng trong môi trường production, hãy bổ sung xử lý lỗi, authentication, validation dữ liệu, các biện pháp bảo mật và điều chỉnh logic cho phù hợp với yêu cầu của ứng dụng.

Integration Guides

Billing Deconstructions

Cookbooks

Giá dựa trên số ghế với các tiện ích bổ sung và liên kết thanh toán

Những gì chúng ta đang xây dựng

Bước 1: Tạo Tiện Ích Bổ Sung Ghế Của Bạn

Bước 2: Tạo Sản Phẩm Đăng Ký Cơ Bản Của Bạn

Bước 3: Kết Nối Tiện Ích Bổ Sung Với Đăng Ký

Bước 4: Tạo Payment Link với số lượng Add-on tùy chỉnh

Bước 5: Kiểm thử triển khai của bạn

Dodo Payments Webhooks Documentation

Khắc phục sự cố

Chúc mừng! Bạn đã triển khai mô hình định giá theo số lượng chỗ ngồi

Base Subscription

Seat Add-ons

Checkout

Web Interface

​Những gì chúng ta đang xây dựng

​Bước 1: Tạo Tiện Ích Bổ Sung Ghế Của Bạn

​Bước 2: Tạo Sản Phẩm Đăng Ký Cơ Bản Của Bạn

​Bước 3: Kết Nối Tiện Ích Bổ Sung Với Đăng Ký

​Bước 4: Tạo Payment Link với số lượng Add-on tùy chỉnh

​Bước 5: Kiểm thử triển khai của bạn

Dodo Payments Webhooks Documentation

​Khắc phục sự cố

​Chúc mừng! Bạn đã triển khai mô hình định giá theo số lượng chỗ ngồi

Base Subscription

Seat Add-ons

Checkout

Web Interface

Những gì chúng ta đang xây dựng

Bước 1: Tạo Tiện Ích Bổ Sung Ghế Của Bạn

Bước 2: Tạo Sản Phẩm Đăng Ký Cơ Bản Của Bạn

Bước 3: Kết Nối Tiện Ích Bổ Sung Với Đăng Ký

Bước 4: Tạo Payment Link với số lượng Add-on tùy chỉnh

Bước 5: Kiểm thử triển khai của bạn

Khắc phục sự cố

Chúc mừng! Bạn đã triển khai mô hình định giá theo số lượng chỗ ngồi