Hướng dẫn này cung cấp mã triển khai mẫu cho một ứng dụng dựa trên terminal. Bạn có thể sửa đổi mã này cho framework cụ thể của bạn (React, Vue, Angular, v.v.) và tùy chỉnh phương thức nhập liệu của người dùng theo nhu cầu của ứng dụng của bạn.
- Tạo hình ảnh sử dụng API DALL-E của OpenAI
- Theo dõi mọi lần tạo hình ảnh để thanh toán
- Tự động tính phí khách hàng dựa trên mức sử dụng
- Xử lý các cấp độ chất lượng khác nhau (chuẩn so với HD)
Những gì chúng ta đang xây dựng
Hãy bắt đầu bằng cách hiểu dịch vụ PixelGen AI của chúng ta:- Dịch vụ: Tạo hình ảnh AI sử dụng API DALL-E của OpenAI
- Mô hình giá: Thanh toán theo hình ảnh ($0.05 mỗi hình ảnh)
- Cấp miễn phí: 10 hình ảnh miễn phí mỗi khách hàng mỗi tháng
- Tùy chọn chất lượng: Hình ảnh chuẩn và HD (cùng mức giá để đơn giản)
Trước khi bắt đầu, hãy đảm bảo bạn có:
- Một tài khoản Dodo Payments
- Quyền truy cập vào API của OpenAI
- Kiến thức cơ bản về TypeScript/Node.js
Bước 1: Tạo Đồng hồ Sử dụng của Bạn
Chúng ta sẽ bắt đầu bằng cách tạo một đồng hồ trong bảng điều khiển Dodo Payments của bạn để theo dõi mọi hình ảnh mà dịch vụ của chúng ta tạo ra. Hãy nghĩ về điều này như là “bộ đếm” theo dõi các sự kiện có thể tính phí.
1
Mở phần Đồng hồ
- Đăng nhập vào bảng điều khiển Dodo Payments của bạn
- Nhấp vào Meters trong thanh bên trái
- Nhấp vào nút Tạo Đồng hồ
2
Điền thông tin cơ bản của đồng hồ
Bây giờ chúng ta sẽ nhập các chi tiết cụ thể cho dịch vụ PixelGen AI của mình:Tên Đồng hồ: Sao chép và dán chính xác →
Image Generation MeterMô tả: Sao chép cái này → Tracks each AI image generation request made by customers using our DALL-E powered serviceTên Sự kiện: Điều này rất quan trọng - sao chép chính xác → image.generated3
Cấu hình cách chúng ta đếm hình ảnh
Thiết lập tổng hợp (cách đồng hồ đếm các sự kiện của chúng ta):Loại Tổng hợp: Chọn Count từ menu thả xuốngĐơn vị Đo lường: Nhập →
imagesChúng tôi sử dụng “Count” vì chúng tôi muốn tính phí theo hình ảnh được tạo ra, không phải theo kích thước hoặc thời gian tạo. Mỗi hình ảnh thành công = 1 đơn vị có thể tính phí.
4
Thêm bộ lọc chất lượng

- Bật Bộ lọc Sự kiện: Bật cái này ON
- Logic Lọc: Chọn OR (điều này có nghĩa là “đếm nếu BẤT KỲ điều kiện nào trong số này là đúng”)
- Thêm điều kiện đầu tiên:
- Khóa Thuộc tính:
quality - Bộ so sánh:
equals - Giá trị:
standard
- Khóa Thuộc tính:
- Nhấp “Thêm Điều kiện” cho điều kiện thứ hai:
- Khóa Thuộc tính:
quality - Bộ so sánh:
equals - Giá trị:
hd
- Khóa Thuộc tính:
5
Tạo đồng hồ của bạn
- Kiểm tra lại tất cả các cài đặt của bạn khớp với các giá trị ở trên
- Nhấp vào Tạo Đồng hồ
Đồng hồ đã được tạo! Đồng hồ “Tạo hình ảnh” của bạn hiện đã sẵn sàng để bắt đầu đếm các lần tạo hình ảnh. Tiếp theo, chúng ta sẽ kết nối nó với một sản phẩm thanh toán.
Bước 2: Tạo Sản phẩm Thanh toán của Bạn
Bây giờ chúng ta cần tạo một sản phẩm xác định mức giá của chúng ta ($0.05 mỗi hình ảnh với 10 hình ảnh miễn phí). Điều này kết nối đồng hồ của chúng ta với thanh toán thực tế.1
Đi tới Sản phẩm
- Trong bảng điều khiển Dodo Payments của bạn, nhấp vào Sản phẩm trong thanh bên trái
- Nhấp vào Tạo Sản phẩm
- Chọn Dựa trên Sử dụng làm loại sản phẩm
2
Nhập chi tiết sản phẩm
Điền vào các giá trị chính xác này cho dịch vụ PixelGen AI của chúng ta:Tên Sản phẩm: Sao chép cái này →
PixelGen AI - Image GenerationMô tả: Sao chép cái này → AI-powered image generation service with pay-per-use billingHình ảnh Sản phẩm: Tải lên một hình ảnh rõ ràng, liên quan.Những điều này sẽ xuất hiện trên hóa đơn của khách hàng, vì vậy hãy làm cho chúng rõ ràng và chuyên nghiệp.
3
Kết nối đồng hồ của bạn

0 để đảm bảo khách hàng chỉ bị tính phí dựa trên mức sử dụng của họ, không có phí cơ bản.Bây giờ, liên kết đồng hồ mà bạn vừa tạo:- Cuộn xuống phần Đồng hồ Liên kết
- Nhấp vào Thêm Đồng hồ
- Từ menu thả xuống, chọn “Đồng hồ Tạo hình ảnh” (cái mà bạn đã tạo trước đó)
- Xác nhận rằng nó xuất hiện trong cấu hình sản phẩm của bạn
Đồng hồ của bạn hiện đã được kết nối thành công với sản phẩm này.
4
Đặt giá của bạn
Đây là nơi chúng ta xác định mô hình kinh doanh của mình:
Giá mỗi Đơn vị: Nhập →

0.05 (đây là $0.05 mỗi hình ảnh)Ngưỡng Miễn phí: Nhập → 10 (khách hàng nhận 10 hình ảnh miễn phí mỗi tháng)5
Lưu sản phẩm của bạn
- Xem lại tất cả các cài đặt của bạn:
- Tên: PixelGen AI - Tạo hình ảnh
- Đồng hồ: Đồng hồ Tạo hình ảnh
- Giá: $0.05 mỗi hình ảnh
- Cấp miễn phí: 10 hình ảnh
- Nhấp vào Lưu Thay đổi
Sản phẩm đã được tạo! Thanh toán của bạn hiện đã được cấu hình. Khách hàng sẽ tự động bị tính phí dựa trên mức sử dụng tạo hình ảnh của họ.
Bước 3: Thực hiện Mua thử nghiệm
Trước khi chúng ta bắt đầu tiếp nhận các sự kiện sử dụng, chúng ta cần thực hiện một giao dịch thử nghiệm.1
Lấy liên kết thanh toán của bạn
- Trong bảng điều khiển Dodo Payments của bạn, đi tới Sản phẩm
- Tìm sản phẩm “PixelGen AI - Tạo hình ảnh” của bạn
- Nhấp vào nút Chia sẻ bên cạnh sản phẩm của bạn
- Sao chép liên kết thanh toán xuất hiện
https://test.checkout.dodopayments.com/buy/pdt_IgPWlRsfpbPd5jQKezzW1?quantity=12
Hoàn thành một giao dịch thử nghiệm
- Mở liên kết thanh toán trong một tab trình duyệt mới
- Nhập thông tin thanh toán thử nghiệm và hoàn tất giao dịch.
Sau khi thanh toán thành công, bạn sẽ có một ID khách hàng mà chúng ta sẽ sử dụng trong mã ứng dụng của mình.
3
Tìm ID khách hàng của bạn
- Quay lại bảng điều khiển Dodo Payments của bạn
- Điều hướng đến Khách hàng trong thanh bên trái
- Tìm khách hàng mà bạn vừa tạo (với email thử nghiệm)
- Sao chép ID khách hàng - nó sẽ trông giống như
cus_abc123def456
Lưu ID khách hàng này - chúng tôi sẽ mã hóa nó trong mã ứng dụng mẫu của mình để đảm bảo các sự kiện được theo dõi chính xác.
Bước 4: Xây dựng Ứng dụng Mẫu
Bây giờ chúng ta đã hoàn tất thiết lập thanh toán và tạo một khách hàng thử nghiệm. Hãy xây dựng ứng dụng PixelGen AI mẫu tạo hình ảnh và tự động theo dõi mức sử dụng để thanh toán.1
Thiết lập dự án của bạn
Tạo một thư mục mới và khởi tạo dự án:
2
Cài đặt các phụ thuộc
Cài đặt các gói mà chúng ta cần:
3
Tạo ứng dụng chính
Tạo một tệp có tên
index.ts và sao chép mã ứng dụng hoàn chỉnh này:Bước 5: Kiểm tra Ứng dụng Mẫu của Bạn
Đến lúc kiểm tra dịch vụ PixelGen AI mẫu của chúng ta và xem thanh toán hoạt động! Hãy đảm bảo mọi thứ hoạt động từ đầu đến cuối.1
Thiết lập môi trường của bạn
Đầu tiên, hãy đảm bảo bạn đã cấu hình mọi thứ:
- Tạo một tệp
.envtrong thư mụcpixelgen-aicủa bạn - Thêm các khóa API thực tế của bạn:
- Cài đặt các phụ thuộc và chạy ứng dụng:
2
Tạo hình ảnh thử nghiệm đầu tiên của bạn
Khi ứng dụng khởi động, bạn sẽ thấy:Hãy thử gợi ý này: “Một robot dễ thương đang vẽ một phong cảnh”Bạn nên thấy đầu ra như thế này:
Nếu bạn thấy “Sự kiện sử dụng đã được gửi thành công”, tích hợp thanh toán của bạn đang hoạt động!
3
Tạo thêm một vài hình ảnh
Hãy tạo 2-3 hình ảnh nữa để kiểm tra nhiều sự kiện. Hãy thử những gợi ý này:
- “Một hoàng hôn trên núi với những đám mây tím”
- “Một máy pha cà phê steampunk trong một nhà bếp Victorian”
- “Một con rồng thân thiện đang đọc sách trong một thư viện”
4
Kiểm tra bảng điều khiển Dodo Payments của bạn
Bây giờ hãy xác minh các sự kiện đang được nhận:
- Mở bảng điều khiển Dodo Payments của bạn
- Đi tới Thanh toán Dựa trên Sử dụng → *Đồng hồ → Đồng hồ Tạo hình ảnh
- Nhấp vào tab Sự kiện
- Bạn nên thấy các sự kiện tạo hình ảnh của mình được liệt kê
- Tên sự kiện:
image.generated - ID khách hàng: ID khách hàng thử nghiệm của bạn
Bạn nên thấy một sự kiện cho mỗi hình ảnh bạn đã tạo!
5
Xác minh các phép tính thanh toán
Hãy kiểm tra xem việc đếm mức sử dụng có hoạt động không:

- Trong đồng hồ của bạn, đi đến tab Khách hàng
- Tìm khách hàng thử nghiệm của bạn
- Kiểm tra cột “Đơn vị đã tiêu thụ”
6
Kiểm tra ngưỡng thanh toán
Hãy vượt quá cấp miễn phí để xem thanh toán hoạt động:
- Tạo thêm 8 hình ảnh (để đạt tổng cộng 12)
- Kiểm tra bảng điều khiển đồng hồ của bạn một lần nữa
- Bạn nên thấy:
- Đơn vị đã tiêu thụ: 12
- Đơn vị có thể tính phí: 2 (12 - 10 miễn phí)
- Số tiền thanh toán: $0.10
Thành công! Thanh toán dựa trên mức sử dụng của bạn đang hoạt động hoàn hảo. Khách hàng sẽ tự động bị tính phí dựa trên mức sử dụng tạo hình ảnh thực tế của họ.
Khắc phục sự cố
Các vấn đề phổ biến và giải pháp của chúng:Sự kiện không xuất hiện trong bảng điều khiển
Sự kiện không xuất hiện trong bảng điều khiển
Nguyên nhân có thể:
- Tên sự kiện không khớp chính xác với cấu hình đồng hồ
- ID khách hàng không tồn tại trong tài khoản của bạn
- Khóa API không hợp lệ hoặc đã hết hạn
- Vấn đề kết nối mạng
- Xác minh tên sự kiện khớp chính xác với cấu hình đồng hồ (phân biệt chữ hoa chữ thường)
- Kiểm tra rằng ID khách hàng tồn tại trong Dodo Payments
- Kiểm tra khóa API với một cuộc gọi API đơn giản
- Kiểm tra kết nối mạng và cài đặt tường lửa
Chúc mừng! Bạn đã xây dựng PixelGen AI
Bạn đã thành công trong việc tạo một đoạn mã cho việc tạo hình ảnh AI với thanh toán dựa trên mức sử dụng! Đây là những gì bạn đã hoàn thành:Đồng hồ Sử dụng
Tạo “Đồng hồ Tạo hình ảnh” theo dõi mọi sự kiện tạo hình ảnh
Sản phẩm Thanh toán
Cấu hình mức giá là $0.05 mỗi hình ảnh với 10 hình ảnh miễn phí mỗi tháng
Ứng dụng AI
Xây dựng một ứng dụng TypeScript hoạt động tạo hình ảnh sử dụng API DALL-E của OpenAI
Thanh toán Tự động
Tích hợp theo dõi sự kiện theo thời gian thực tự động tính phí khách hàng