Skip to main content

GitHub Repository

Boilerplate cho Expo, React Native và Dodo Payments.

Tổng quan

Expo boilerplate là một ứng dụng Expo hoạt động được, dùng để bán gói đăng ký thông qua hosted checkout của Dodo Payments. Ứng dụng gồm hai phần: một ứng dụng Expo Router viết bằng TypeScript và một máy chủ Express nhỏ trong server/, có nhiệm vụ tạo các phiên checkout bằng API key của bạn. Ứng dụng yêu cầu máy chủ cung cấp URL checkout, mở URL đó trong trình duyệt hệ thống bằng expo-web-browser và nhận kết quả thông qua deep link.
Boilerplate sử dụng Expo SDK 54, Expo Router và TypeScript. API key được lưu trên máy chủ. Ứng dụng chỉ biết URL của máy chủ.

Điều kiện tiên quyết

  • Node.js 18 trở lên.
  • Expo CLI hoặc EAS CLI.
  • Tài khoản Dodo Payments có sản phẩm. Tạo sản phẩm trong Products trên dashboard.
  • iOS Simulator, Android Emulator hoặc thiết bị vật lý.

Bắt đầu nhanh

1

Clone the Repository

Clone repository boilerplate và chuyển đến thư mục dự án:
2

Get Your API Credentials

Lấy API key từ dashboard của Dodo Payments ở test mode:
  • API Key: Truy cập Developer → API Keys trong dashboard.
Build ở test mode để mô phỏng thanh toán mà không chuyển tiền thật.
3

Configure Environment Variables

Ứng dụng và máy chủ mỗi bên đọc tệp .env riêng. Sao chép cả hai tệp mẫu:
Trong server/.env, thêm API key của bạn. DODOPAYMENTS_RETURN_URL phải sử dụng scheme từ app.json, tức là dodoexpo trong boilerplate:
server/.env
Trong tệp .env ở thư mục gốc, đặt EXPO_PUBLIC_BACKEND_URL thành URL của máy chủ, chẳng hạn http://localhost:3000. Ứng dụng gửi các yêu cầu checkout đến EXPO_PUBLIC_BACKEND_URL/checkout.Sau đó mở server/server.js và thay your-product-id bằng ID sản phẩm của bạn. ID sản phẩm bắt đầu bằng pdt_.
Không commit các tệp .env vào hệ thống kiểm soát phiên bản. Tệp .gitignore ở thư mục gốc đã loại trừ .env.Không bao giờ đặt API key của Dodo Payments trong biến EXPO_PUBLIC_*. Expo nhúng các biến này vào JavaScript bundle, vì vậy bất kỳ ai tải ứng dụng của bạn đều có thể đọc chúng. Hãy giữ key trên máy chủ như boilerplate thực hiện và chỉ truyền checkout_url tương ứng đến ứng dụng. Xem Mobile Integration.
4

Install Dependencies

Cài đặt các package cho ứng dụng và máy chủ:
5

Start the Development Server

Khởi động backend trong một terminal, sau đó khởi động Expo trong terminal thứ hai:
Nhấn i cho iOS Simulator hoặc a cho Android Emulator, hoặc quét mã QR trên thiết bị của bạn. Dự án bao gồm expo-dev-client, và liên kết quay lại dodoexpo:// cần scheme riêng của ứng dụng, vì vậy hãy chạy ứng dụng trong bản development build (npx expo run:ios hoặc npx expo run:android) thay vì Expo Go.Thiết bị vật lý không thể truy cập localhost trên máy tính của bạn. Để kiểm thử trên thiết bị, đặt EXPO_PUBLIC_BACKEND_URL thành địa chỉ mạng cục bộ của máy tính, chẳng hạn http://192.168.1.10:3000.
Màn hình chính hiển thị thẻ gói có nút checkout. Nhấn vào nút này để mở checkout, thanh toán bằng thẻ kiểm thử 4242 4242 4242 4242, rồi ứng dụng sẽ mở màn hình kết quả thanh toán.

Có gì trong boilerplate

Boilerplate bao gồm:

Checkout Integration

Một máy chủ mẫu tạo các phiên checkout và một app service yêu cầu rồi mở các phiên đó.

Payment Handling

Màn hình kết quả đọc status từ deep link dodoexpo://payment/result và hiển thị trạng thái thành công hoặc thất bại.

TypeScript Support

Cấu hình TypeScript với các type cho request và response checkout.

Expo Router

Điều hướng dựa trên file với Expo Router, bao gồm bố cục tab và route kết quả thanh toán.

Cấu trúc dự án

Đây là các tệp chính trong repository:

Các bước tiếp theo

Sau khi boilerplate chạy được:
1

Create Your Products

Thêm sản phẩm trong dashboard Dodo Payments, rồi sử dụng ID của chúng trong server/server.js.
2

Customize the Integration

Thay đổi nội dung gói trong config/product.ts, đồng thời thay đổi tên ứng dụng, scheme và bundle identifiers trong app.json. Nếu thay đổi scheme, hãy cập nhật DODOPAYMENTS_RETURN_URL cho khớp.
3

Test on Real Devices

Kiểm thử quy trình thanh toán và việc quay lại qua deep link trên các thiết bị iOS và Android vật lý.
4

Go Live

Thay máy chủ mẫu bằng backend của riêng bạn, có chức năng xác thực người dùng và cấp quyền truy cập từ webhooks. Sau đó chuyển sang live mode API key và build ứng dụng cho môi trường production.

Build cho môi trường production

Build các binary sẵn sàng đưa lên store bằng EAS Build:
1

Install EAS CLI

2

Configure EAS

Repository không có eas.json. Lệnh này sẽ tạo tệp đó:
3

Build Your App

Đối với iOS:
Đối với Android:

Tài nguyên bổ sung

Mobile Integration Guide

Các mobile checkout SDK, thiết lập deep link và cài đặt mobile checkout.

Integration Guide

Các phiên checkout, payment link và webhook.

API Reference

Mọi endpoint API của Dodo Payments.

Hỗ trợ

Nếu cần trợ giúp về boilerplate:
Lần sửa đổi cuối 26 tháng 9, 2026