Gói chính thức · Thành phần thời gian thực

Phòng chờ ảo cho mở bán vé và flash sale

Khi quá nhiều người đến cùng lúc, khách nhận số thứ tự, xem hàng di chuyển trực tiếp và được vào theo tốc độ bạn chọn. Edge hoặc máy chủ của bạn kiểm tra vé đã ký trước khi trả trang.

Phiên bản trên npmGiấy phép

@hibira-io/waiting-roomnpm ↗GitHub ↗

Cách nhanh nhất: plugin Hibira và một prompt

Cài plugin vào agent lập trình AI của bạn rồi dán prompt. Agent sẽ đăng nhập, tạo ứng dụng miễn phí nếu cần, viết mã và gửi một sự kiện thử. GitHub ↗

  1. Cài plugin

    claude plugin marketplace add hibira-io/agent-plugin
claude plugin install hibira@hibira

  2. Dán prompt này

    Add Hibira Waiting room (@hibira-io/waiting-room) to this project.
Follow https://hibira.io/guides/waiting-room, adapted to how this project is already set up.
If I have no Hibira app yet, create a Free one that allows http://localhost so I can test right away.
Keep the app key and secret in environment variables, add placeholders to .env.example, and never commit real values or send the secret to a browser.
When you are done, send a test event, show me it arriving, and list the files you changed.

Muốn tự làm? Các bước bên dưới:

  1. Cài đặt
  2. Tạo phòng chờ
  3. Bảo vệ trang

Công cụ AI khác và nội dung plugin →

  • Trang chờ được lưu trữ sẵn bằng bảy ngôn ngữ; không cần tự làm trang.
  • protect() cho Cloudflare Workers, middleware Next.js và Vercel, Deno, Bun và Express.
  • Hẹn giờ bắt đầu, tạm dừng, đóng khi hết hàng, hoặc cho vài trăm người tiếp theo vào cùng lúc.
  • Khách giữ chỗ khi tải lại trang. Khi ứng dụng chạm giới hạn kết nối, trang chuyển sang polling thay vì từ chối ai.
Trang chờ được lưu trữ cho đợt mở bán trước: số thứ tự, số người phía trước và thời gian chờ ước tính.
Trang chờ được lưu trữ cho đợt mở bán trước: số thứ tự, số người phía trước và thời gian chờ ước tính.

Đăng nhập để xem các đoạn mã này với host cụm của riêng bạn. Đăng nhập

  1. Cài đặt

    npm install @hibira-io/waiting-room pusher

  2. Tạo phòng chờ

    import Pusher from 'pusher';

const pusher = new Pusher({
  appId: process.env.HIBIRA_APP_ID,
  key: process.env.HIBIRA_KEY,
  secret: process.env.HIBIRA_SECRET,
  host: 'ws.hibira.io',
  useTLS: true,
});

await pusher.post({
  path: '/waiting_rooms/presale',
  body: {
    admit_per_minute: 300,
    state: 'open', // or 'paused', 'closed'
    title: 'Winter tour presale',
    return_urls: ['https://shop.example.com/'],
  },
});

  3. Bảo vệ trang

    // middleware.js (Next.js)
import { NextResponse } from 'next/server';
import { protect } from '@hibira-io/waiting-room/server';

export async function middleware(request) {
  const blocked = await protect(request, {
    appKey: process.env.HIBIRA_KEY,
    secret: process.env.HIBIRA_SECRET,
    room: 'presale',
  });
  return blocked ?? NextResponse.next();
}

export const config = { matcher: ['/drop/:path*'] };

Trước khi bắt đầu

  • return_urls phải có trang khách quay lại, nếu không trang chờ sẽ không đưa họ về đó.
  • Vé có hiệu lực 30 phút theo mặc định. Nếu mỗi số chỉ được thanh toán một lần, hãy lưu ticketId khi thanh toán.
  • Secret của ứng dụng chỉ hiện một lần, khi bạn tạo ứng dụng hoặc xoay vòng secret. Hãy giữ nó trên máy chủ, không bao giờ đưa vào trình duyệt hay bản build game.

Dùng app key từ bảng điều khiển; secret chỉ để trên máy chủ của bạn. Kênh, sự kiện và endpoint xác thực hoạt động y như với Pusher. Tạo tài khoản miễn phí →