Live Events

// Browser API tidak mendukung custom header secara langsung.
// Gunakan token di query string untuk channel yang mendukungnya,
// atau gunakan Subprotocol header sebagai workaround.

// Cara yang digunakan Lenz: token sudah valid dari sesi login
const wsProtocol = location.protocol === 'https:' ? 'wss' : 'ws';
const baseUrl = location.host; // misalnya: lenz.contoh.com

const url = new URL(`${wsProtocol}://${baseUrl}/api/event_channel`);
url.searchParams.set('stream_ids', 'eb7022a64d9173a6,c1105b1c6e6b4f3a');
url.searchParams.set('analytic_id', 'NFV4-FR,NFV4-LPR');
url.searchParams.set('disable_base64_image', 'true');

const ws = new WebSocket(url.toString());

ws.onopen = () => {
  console.log('Terhubung ke event channel');
};

ws.onmessage = (event) => {
  const data = JSON.parse(event.data);
  console.log('Event baru:', data);
};

ws.onclose = (event) => {
  console.log('Koneksi tertutup:', event.code, event.reason);
};

ws.onerror = (error) => {
  console.error('WebSocket error:', error);
};

import WebSocket from 'ws';

// Dapatkan token terlebih dahulu melalui login
const token = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9...';

const params = new URLSearchParams({
  stream_ids: 'eb7022a64d9173a6,c1105b1c6e6b4f3a',
  analytic_id: 'NFV4-FR,NFV4-LPR',
  disable_base64_image: 'true',
});

const ws = new WebSocket(
  `wss://raisa.contoh.com/api/event_channel?${params.toString()}`,
  {
    headers: {
      Authorization: `Bearer ${token}`,
    },
  }
);

ws.on('open', () => {
  console.log('Terhubung ke event channel');
});

ws.on('message', (data) => {
  const event = JSON.parse(data.toString());
  handleEvent(event);
});

ws.on('close', (code, reason) => {
  console.log(`Koneksi tertutup: ${code} ${reason}`);
  // Implementasikan reconnect dengan exponential backoff
  setTimeout(() => reconnect(), 5000);
});

ws.on('error', (error) => {
  console.error('WebSocket error:', error.message);
});

function handleEvent(event) {
  // Proses event berdasarkan analytic_id
  switch (true) {
    case event.analytic_id.includes('FR'):
      console.log(`[FRA] ${event.stream_id} - Status: ${event.pipeline_data?.status}`);
      break;
    case event.analytic_id.includes('LPR'):
      console.log(`[LPR] ${event.stream_id} - Plat: ${event.pipeline_data?.plate_number}`);
      break;
    default:
      console.log(`[${event.analytic_id}] ${event.stream_id}`);
  }
}

# cURL tidak mendukung WebSocket secara native.
# Gunakan websocat (https://github.com/vi/websocat) sebagai alternatif:

TOKEN="eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9..."

websocat \
  -H "Authorization: Bearer ${TOKEN}" \
  "wss://raisa.contoh.com/api/event_channel?stream_ids=eb7022a64d9173a6&disable_base64_image=true"

{
  "face_id": "118747588341006337",
  "similarity": 0.9234,
  "status": "KNOWN",
  "confidence_detection": 0.9988,
  "variation": "13219648471735459236"
}

{
  "plate_number": "B 1234 XYZ",
  "label": "car",
  "confidence": 0.9251,
  "area_name": "Gerbang Masuk",
  "bounding_box": {
    "top": 0.409,
    "left": 0.284,
    "width": 0.247,
    "height": 0.198
  }
}

{
  "area_name": "Area 1",
  "label": "person",
  "confidence": 0.9998,
  "count": 3
}