Xuất app sang Zalo Mini App

Đưa app JustVibe của bạn chạy bên trong Zalo (75 triệu user VN). Toàn quy trình ~30 phút setup ban đầu, sau đó 1 click mỗi lần cập nhật.

🎯 Khi nào nên dùng Zalo Mini App?

  • Khách của bạn dùng Zalo nhiều (F&B, salon, shop nhỏ, sự kiện) — họ không cần cài app, không cần nhập URL, chỉ cần quét QR hoặc bấm từ chat
  • Cần thanh toán nhanh không out-of-app — ZaloPay native + ZNS notify cho khách
  • Cần phân phối qua Zalo Official Account của business — followers nhận tin app mới ngay

Không phù hợp khi: app cần SEO, cần Google index, hoặc target user quốc tế.

📋 Chuẩn bị (làm 1 lần)

  1. Zalo Official Account (OA) verified của doanh nghiệp. Đăng ký miễn phí tại oa.zalo.me. Cần giấy phép kinh doanh + giấy tờ pháp nhân. Zalo xét duyệt ~3-5 ngày.
  2. Đăng ký tài khoản Zalo Developers tại developers.zalo.me với cùng số Zalo có OA.
  3. Tạo Mini App mới: Console → New App → chọn loại Zalo Mini App. Ghi lại App ID mà Zalo cấp cho bạn — sẽ paste vào app-config.json.
  4. Chuẩn bị icon 192×192 PNG (logo brand) — Zalo sẽ reject submission nếu bạn dùng icon placeholder JV cấp sẵn.

🚀 Tải Mini App từ JustVibe

  1. Vào Dashboard → tìm app bạn muốn xuất → bấm nút 💬 Zalo .zip
  2. File <ten-app>.zmp.zip tự tải về máy — bên trong có 3 file:
    • index.html — code app của bạn (đã inject JV runtime)
    • app-config.json — Zalo runtime config (header color, status bar, etc.) theo schema chính thức của ZMA
    • README.txt — hướng dẫn submit + note về App ID
  3. Không cần giải nén — upload nguyên zip lên Zalo Developers.

📤 Submit lên Zalo Developers

  1. Vào Zalo Developers Console → app vừa tạo → tab Source Code → upload zip JV vừa tải.
  2. Tab App Info → upload icon brand 192×192 PNG ở field App Icon.⚠ Icon KHÔNG nằm trong zip (Zalo lấy từ Console upload riêng).
  3. App ID tự gán bởi Zalo khi tạo app — không cần paste vào file nào, Zalo SDK đọc từ runtime. (Khác với hướng dẫn cũ của JV — schema đã đúng theo chuẩn ZMA.)
  4. Tab Preview để test thử trong Zalo của bạn trước khi submit.
  5. Khi OK → tab Submit Review → Zalo xét duyệt:
    • Lần đầu: ~3-5 ngày làm việc
    • Update sau: ~1 ngày làm việc
  6. Approve → app live tại zalo.me/s/<app-id> + có thể QR code phân phối.

🔧 Giới hạn của bản single-file HTML

JV xuất 1 file HTML duy nhất — chạy ngon trong Zalo webview cho hầu hết use case (menu, booking, catalog, landing, lead capture), DÙNG ĐƯỢC jv.db / jv.files / jv.auth / jv.payment.vietqr bình thường.

Tính năng native Zalo (ZaloPay 1-tap, openShareSheet, getUserInfo, setStorage) cần npm package zmp-sdk + React project — KHÔNG dùng được từ single-file HTML.

Nếu app cần native ZaloPay hoặc Zalo login, anh có 2 lựa chọn:

  • JV-only flow (recommend): dùng VietQR cho payment + jv.auth Google cho login. Đủ 80% use case SMB.
  • Hand HTML cho developer: dev wrap thành Vite + React project, add zmp-sdk calls, build, deploy bằng zmp deploy. Mất ~1-2 ngày dev.

⚠️ Quy tắc Zalo hay reject

  • Không dùng external CDN script — JV mode zalo_mini_app đã đảm bảo inline, nhưng nếu anh edit thêm tag <script src="..."> bên ngoài → reject
  • Permissions phải khớp với feature — đừng xin scope.userLocation nếu app không dùng GPS
  • Vietnamese-only content — app full English Zalo cũng reject
  • Icon thật, không placeholder — Zalo nhìn icon đầu tiên
  • Không scrape data từ Zalo — không truy cập friend list, message history

🔄 Cập nhật app sau review

  1. Edit app trên JustVibe như thường — bấm Deploy
  2. Tải .zip mới từ Dashboard
  3. Upload lại trong Zalo Developers → Submit Review
  4. ~1 ngày → version mới live

⚠️ Khác với web (deploy 1 click live ngay), Zalo Mini App MỖI UPDATE đều phải qua Zalo review. Đây là constraint Zalo, không phải JV.

🆘 Lỗi thường gặp

  • "App chưa deploy" — bấm Deploy trên Dashboard ít nhất 1 lần trước khi tải zip. JV chỉ đóng gói version đã live trên subdomain.
  • "Network request blocked" trong Zalo Preview — JV runtime gọi justvibe.me đã whitelist trong app-config.json/network/allowedHosts. Nếu app gọi domain khác, thêm vào danh sách đó.
  • "Permission denied: scope.X" — sửa app-config.json/permissions trên Zalo Developers UI rồi re-submit.
Mẹo: Zalo Mini App là một trong những kênh phân phối chỉ có ở Việt Nam. Các tool no-code global (Lovable, v0, Bolt) chưa hỗ trợ. Đây là lợi thế đặc biệt cho business VN — tận dụng sớm.