Ứng dụng (plugin): bắt đầu trong 10 phút

Trong giao diện Deplao, plugin hiển thị là Ứng dụng (Công cụ → Ứng dụng, API & Webhook). Tài liệu và mã nguồn giữ chữ plugin: file deplao-plugin.json, gói @deplao/plugin-sdk, lệnh deplao-plugin, endpoint /api/v1/plugins.

Plugin là ứng dụng bất kỳ chạy ngay trong Deplao: công cụ nội bộ, kết nối hệ thống riêng, nghiệp vụ theo ngành… với giao diện và công nghệ web tuỳ bạn chọn. Plugin có thể thêm trang riêng, panel trong màn chat, nút trong ô soạn tin, node workflow, route API, lịch chạy. Mọi thứ plugin làm với dữ liệu đều đi qua deplao.*: cùng API v1, cùng kiểm tra quyền như app ngoài.

#1. Tạo plugin

node packages/plugin-cli/bin/deplao-plugin.js create my-shop --runtime web --id vn.acme.myshop --name "My Shop"

#2. Chạy thử ngay trong app

Công cụ → Ứng dụng, API & Webhook (thanh điều hướng) → nút Phát triển ứng dụng → Thêm thư mục đang phát triển → chọn thư mục → duyệt quyền. Plugin hiện thành một ô trong danh sách Ứng dụng đã cài; bấm Mở để vào trang của plugin, bấm vào ô để xem chi tiết, cài đặt, nhật ký. Sửa file trong backend/ thì plugin tự tải lại; sửa UI thì bấm nút tải lại trên đầu trang plugin.

#3. Gọi Deplao từ UI

<script src="/__deplao/sdk.js"></script>
<script src="app.js" defer></script>

deplao.ready(async () => {
  const accounts = await deplao.accounts.listAccounts();
  const convs = await deplao.chat.listConversations({ accountId: accounts[0].id, limit: 10 });
  await deplao.chat.sendMessage({ accountId: accounts[0].id, threadId: convs[0].thread_id, text: 'Xin chào' });
  deplao.events.on('message.received', (ev) => console.log(ev.data.message.text));
});

• Tên hàm = operationId của endpoint (xem danh sách endpoint ở trang này). Tham số phẳng: path + query (GET/DELETE) hoặc body (POST/PUT/PATCH).
• Script inline bị CSP chặn: đặt code trong file .js riêng.
• Giao diện tự do: CSS thuần, Tailwind, React, Vue, Svelte… build ra file tĩnh trong thư mục UI (script/CSS/font từ CDN bị CSP chặn: đóng gói kèm plugin).
• Hợp theme sáng/tối của Deplao (tuỳ chọn): đọc deplao.ui.theme() / deplao.ui.onTheme(), hoặc dùng biến CSS --dp-bg, --dp-surface, --dp-text, --dp-text-muted, --dp-accent, --dp-border… SDK gắn sẵn lên trang.

#4. Đóng gói và cài

node packages/plugin-cli/bin/deplao-plugin.js validate my-shop
node packages/plugin-cli/bin/deplao-plugin.js pack my-shop

Công cụ → Ứng dụng, API & Webhook → Cài ứng dụng (chọn file .zip). Cập nhật = cài file zip có version lớn hơn; quyền mới phải được duyệt lại.

Plugin mẫu: examples/plugins/hello-world (web), spa-booking (local, gần đủ điểm mở rộng), order-sync-remote (remote).