Xây dựng · WooCommerce

Xây dựng plugin try-on cho WooCommerce

Tóm tắt trong một câu

Plugin WooCommerce gọi Photta API qua HTTP tiêu chuẩn từ sự kiện WP-Cron, poll job ở tick kế tiếp và import ảnh hoàn tất vào media library.

Lấy API keyĐọc tài liệu endpoint try-on
  • Credits: 5 credits ở 2K · 6 credits ở 4K
  • Thời gian điển hình: 1.5–4 min
  • Xử lý: async, polling

Mọi số liệu trên trang này đều lấy từ tài liệu Photta API · đã kiểm tra

Không cần PHP SDK. WP-Cron gửi job, tick tiếp theo sẽ poll, và WP-CLI import ảnh hoàn tất vào media library.

RESPONSE=$(curl -s -X POST https://api.photta.app/api/v1/tryon/apparel \
  -H "Authorization: Bearer $PHOTTA_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{
  "product_type": "top",
  "product_images": [
    "https://cdn.yourstore.com/products/shirt-front.jpg"
  ],
  "product_back_image": "https://cdn.yourstore.com/products/shirt-back.jpg",
  "product_category": "t_shirt",
  "mannequin_id": "mnk_f3a9b1",
  "pose_id": "pose_c2d4e5",
  "background": "https://cdn.yourstore.com/backgrounds/studio-loft.jpg",
  "lock_background": true,
  "resolution": "2K",
  "aspect_ratio": "3:4",
  "body_size": "M",
  "expression": "neutral",
  "user_instruction": "Keep the collar pattern crisp and centered."
}')
ID=$(echo "$RESPONSE" | jq -r '.data.id')

Cơ chế hoạt động

Một cron tick, một lần poll và import media

Lập kế hoạch plugin, lên lịch xử lý, gửi job, poll ở tick tiếp theo, import.

  1. Bước 1

    Lập kế hoạch xây dựng plugin

    Một bảng queue, một cron hook, một màn hình cấu hình API key. Quá trình tạo ảnh không bao giờ chạy trong request tải trang, nên trải nghiệm của người mua hàng sẽ không bị treo.

  2. Bước 2

    Lấy API key của Photta

    Đọc key từ biến môi trường trong wp-config.php thay vì lưu vào bảng options, tránh lộ thông tin xác thực khi export cơ sở dữ liệu.

  3. Bước 3

    Lên lịch cron event

    Đăng ký một hook định kỳ và xử lý một lượng nhỏ sản phẩm trong queue mỗi lần chạy. Trang web có lượng truy cập thực tế sẽ kích hoạt tick thường xuyên; trang web ít tương tác cần dùng system cron thực sự.

  4. Bước 4

    Gửi sản phẩm

    Gửi ảnh sản phẩm bằng wp_remote_post — dùng cùng URL, headers và JSON body như ví dụ cURL. Lưu id trả về vào hàng tương ứng trong queue.

  5. Bước 5

    Poll ở tick kế tiếp

    Đọc trạng thái của mọi hàng vẫn đang processing. Vì các tick cách nhau vài phút, mỗi tick poll một lần là đủ; không có tiến trình nào phải sleep trong request.

  6. Bước 6

    Import ảnh

    Khi job hoàn tất, hãy import URL vào media library và gán vào sản phẩm. WP-CLI sẽ đảm nhận việc tải về để plugin không bao giờ phải đệm file.

Bốn thành phần vận hành của plugin

Các lệnh gọi Photta được tạo dựa trên tài liệu API; wp_remote_post nhận cùng URL, headers và body.

# wp-config.php holds the key; the plugin reads it with getenv()
# define( 'PHOTTA_API_KEY', getenv( 'PHOTTA_API_KEY' ) );
export PHOTTA_API_KEY="photta_live_xxx"
export PHOTTA_BASE_URL="https://api.photta.app/api/v1"
RESPONSE=$(curl -s -X POST https://api.photta.app/api/v1/tryon/apparel \
  -H "Authorization: Bearer $PHOTTA_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{
  "product_type": "top",
  "product_images": [
    "https://cdn.yourstore.com/products/shirt-front.jpg"
  ],
  "product_back_image": "https://cdn.yourstore.com/products/shirt-back.jpg",
  "product_category": "t_shirt",
  "mannequin_id": "mnk_f3a9b1",
  "pose_id": "pose_c2d4e5",
  "background": "https://cdn.yourstore.com/backgrounds/studio-loft.jpg",
  "lock_background": true,
  "resolution": "2K",
  "aspect_ratio": "3:4",
  "body_size": "M",
  "expression": "neutral",
  "user_instruction": "Keep the collar pattern crisp and centered."
}')
ID=$(echo "$RESPONSE" | jq -r '.data.id')
# $ID is data.id from the POST response. Poll every 3 seconds until status is "completed" or "failed".
for i in $(seq 1 120); do
  RESULT=$(curl -s "https://api.photta.app/api/v1/tryon/apparel/$ID" -H "Authorization: Bearer $PHOTTA_API_KEY")
  STATUS=$(echo "$RESULT" | jq -r '.data.status')
  [ "$STATUS" = "completed" ] && break
  [ "$STATUS" = "failed" ] && echo "generation failed" && exit 1
  sleep 3
done
echo "$RESULT" | jq -r '.data.output_url'
# WP-CLI does the download, so the plugin never buffers the file itself
wp media import "$OUTPUT_URL" \
  --post_id="$PRODUCT_ID" \
  --title="Virtual try-on" \
  --featured_image

Câu hỏi thường gặp từ developer

Những câu hỏi các lập trình viên WordPress thường gặp

Có PHP SDK chính thức không?

Không. API là chuẩn REST qua HTTPS với bearer header, vì vậy wp_remote_post đáp ứng đầy đủ mọi nhu cầu mà không cần quản lý thêm dependency.

Làm thế nào để gọi API từ PHP?

Dùng wp_remote_post với các header Authorization và Content-Type cùng một JSON body. Mẫu cURL trên trang này chính là request tương đương, khớp từng trường dữ liệu.

Tại sao không render ngay khi tải trang?

Quá trình tạo ảnh mất nhiều thời gian hơn thời lượng tải của một trang web. Render trực tiếp trong request khiến khách mua phải chờ đợi, dễ bị timeout làm hủy tiến trình, trong khi credits vẫn bị trừ trong cả hai trường hợp.

Mỗi lần chạy nên xử lý bao nhiêu sản phẩm?

Xử lý một lượng nhỏ mỗi tick và để queue được giải phóng dần qua các tick. Cách này giúp mỗi lần chạy diễn ra nhanh chóng và đảm bảo hệ thống luôn nằm trong ngưỡng rate limit quy định.

Điều gì xảy ra với các job bị failed?

Đánh dấu hàng là failed và ghi nhận loại lỗi từ response. Credits cho lượt tạo ảnh bị lỗi sẽ được hoàn lại tự động, nên việc thử lại không làm tốn chi phí hai lần.

Các trang liên quan

Tài liệu liên quan

Mọi số liệu trên trang này đều lấy từ tài liệu Photta API · đã kiểm tra

Plugin không phụ thuộc dependency

Bearer header, JSON body, polling. Toàn bộ là những cơ chế WordPress đã hỗ trợ sẵn.

Lấy API keyĐọc hướng dẫn quickstart