Розробка мобільного додатку для електронного квитка (Digital Ticket)

Розробка мобільного додатку для електронного квитка (Digital Ticket)

Електронний квиток—це не просто PDF з QR-кодом у вигляді файлу. Сучасний Digital Ticket—це живий об'єкт: він оновлюється при переносі мероприятия, показує схему залу, дозволяє увійти через NFC або Wallet, та валідується сканером без інтернету на стороні контролера.

Формати зберігання та передачи квитка

Додаток повинен підтримувати кілька каналів зберігання:

In-app storage—квиток зберігається в додатку як об'єкт у базі (Core Data / Room), QR генеруєтся на льоту з ticketToken. Вимагає інтернету для першого завантаження.

Apple Wallet / Google Wallet—додається через PKAddPassesViewController або Google Pay SDK. Доступний без інтернету, оновлюється через push. Окрема інтеграція.

PDF—генеруєтся на серверу (PDFKit/wkhtmltopdf), скачується користувачем. Використовується як резервний варіант.

Для більшості додатків робимо все три—користувач сам вибирає зручний варіант.

Генерація та валідація QR

QR-код повинен містити не просто номер замовлення, а підписаний токен—інакше його можна підробити, скопіювавши зображення екрану.

Схема: сервер генерирує ticketToken = HMAC-SHA256(ticketId + userId + expiresAt, secret). Контролер сканує QR → додаток контролера відправляє токен на POST /tickets/validate → сервер перевіряє HMAC та статус використання.

import hmac, hashlib, time

def generate_ticket_token(ticket_id: str, user_id: str, secret: str) -> str:
    expires_at = int(time.time()) + 86400 * 30  # дійсний 30 днів
    message = f"{ticket_id}:{user_id}:{expires_at}"
    signature = hmac.new(
        secret.encode(), message.encode(), hashlib.sha256
    ).hexdigest()
    return f"{message}:{signature}"

def validate_ticket_token(token: str, secret: str) -> dict:
    parts = token.split(":")
    if len(parts) != 4:
        return {"valid": False, "reason": "malformed_token"}

    ticket_id, user_id, expires_at, signature = parts
    expected = hmac.new(
        secret.encode(),
        f"{ticket_id}:{user_id}:{expires_at}".encode(),
        hashlib.sha256
    ).hexdigest()

    if not hmac.compare_digest(signature, expected):
        return {"valid": False, "reason": "invalid_signature"}

    if int(expires_at) < int(time.time()):
        return {"valid": False, "reason": "expired"}

    return {"valid": True, "ticketId": ticket_id, "userId": user_id}

Для подій з високим ризиком перепродажі використовуємо rotating QR—токен змінюється кожні 30–60 секунд (TOTP-логіка). Скриншот одразу застаріває.

Офлайн-валідація

Контролер на вході може бути без інтернету. Два підходи:

Офлайн-список—додаток контролера завантажує список валідних ticketId заранее (напр., за годину до початку). Сканує QR, перевіряє по локальному списку. Ризик: не можемо позначити квиток як використаний до синхронізації.

Цифрова підпись без сервера—контролер верифікує HMAC з публічним ключем, вбудованим у додаток. При цьому PAN не зберігається, а лише публічний ключ. Відозвати окремий квиток офлайн не можемо—лише чорний список, завантажуваний заранее.

Схема залу та вибір місць

Якщо мероприятие припускає нумеровані місця—потрібна інтерактивна схема залу. Реалізується через SVG або кастомний Canvas. На React Native зручний react-native-svg, на Flutter—CustomPainter.

// Flutter: кастомний painter для рядів крісел
class SeatMapPainter extends CustomPainter {
  final List<Seat> seats;
  final Set<String> selectedSeats;

  @override
  void paint(Canvas canvas, Size size) {
    for (final seat in seats) {
      final paint = Paint()
        ..color = selectedSeats.contains(seat.id)
            ? Colors.blue
            : seat.isAvailable ? Colors.green : Colors.grey;

      canvas.drawRRect(
        RRect.fromRectAndRadius(
          Rect.fromLTWH(seat.x, seat.y, 28, 24),
          const Radius.circular(4),
        ),
        paint,
      );
    }
  }

  @override
  bool shouldRepaint(SeatMapPainter oldDelegate) =>
      oldDelegate.selectedSeats != selectedSeats;
}

Схема завантажується як JSON з координатами кожного кріслу. При масштабуванні залу використовуємо InteractiveViewer (Flutter) або UIPinchGestureRecognizer + CATransform3D (iOS).

Повернення та передача

Логіка повернення квитка—на серверу. Додаток відображає статус: ACTIVE, USED, REFUNDED, TRANSFERRED. При переносі мероприятия сервер відправляє push → додаток оновлює дані квитка.

Важливий edge case: квиток повинен залишатися видимим навіть після USED—користувач хоче бачити історію відвідувань.

Ориентири по терміне

Базова версія (in-app QR, покупка, історія): 4–6 тижнів. Додавання схеми залу з вибором місць—ще 2–3 тижні. Wallet-інтеграція (Apple / Google)—ще 3–5 днів. Вартість розраховується індивідуально.