Pano Entegrasyon Dökümantasyonu

M2M access token alın (sunucu tarafı)

const res = await fetch('https://giris.eyena.net/connect/token', {
  method: 'POST',
  headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
  body: new URLSearchParams({
    grant_type: 'client_credentials',
    client_id: 'embed-abc123',
    client_secret: 'GIZLI_SECRET',
    scope: 'api',
  }),
})
const { access_token } = await res.json()

Pano oturumu oluşturun veya katılın (sunucu tarafı)

const res = await fetch('https://api.eyena.net/api/embed/board-session', {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json',
    Authorization: `Bearer ${access_token}`,
    Origin: 'https://sizin-siteniz.com',   // kayıtlı origin ile eşleşmeli
  },
  body: JSON.stringify({
    role: 'instructor',                    // ZORUNLU — 'instructor' | 'student'
    displayName: 'Ayşe Öğretmen',
    baslik: 'Ders 3 — Kesirler',           // opsiyonel, yalnızca eğitmen
    shareUrl: 'https://sizin-siteniz.com/board/{roomId}',  // kendi katılım sayfanız
    // roomId: 'abc123…'                   // öğrenciler için ZORUNLU; yeni pano için boş bırakın
  }),
})
const { boardToken, roomId, expiresAt } = await res.json()

role katılımcının ne göreceğini belirler — açıkça gönderin

Rol boardToken'a işlenir ve tarayıcıda değiştirilemez. Gömülü panonun eğitmen ile öğrenciyi ayırt etmek için kullandığı tek bilgi budur:

role gönderilmezse istek 400 döner; sessizce student sayılmaz. Eski davranış buydu ve kafa karıştırıcı bir hataya yol açıyordu: eğitmenin kendi çerçevesi kamera onayı soruyor, kalibrasyona sokuyor ve eğitmen düğmelerini gizliyordu. Böyle bir durumda çerçevede öğrenci jetonu vardır — boardToken'ın roleclaim'ine bakın ya da çözümlenen rolü bildiren eyena-board-ready mesajını dinleyin.

Paylaşım bağlantıları bize değil, size işaret eder

Pano içindeki "bağlantıyı kopyala" düğmesi sizinURL'nizi verir; çünkü öğrenciler sizin sayfanızdan katılır — oturumu sizin backend'iniz üretir, iframe'i sizin sayfanız açar. Bir board.eyena.net bağlantısı onların işine yaramaz.

shareUrl: 'https://sizin-siteniz.com/board/{roomId}'
        → https://sizin-siteniz.com/board/9f2b7c1d4e6a8b0c2d4e

Katılım sayfanız bu roomId'yi okur, o oda için bir studentoturumu oluşturur ve iframe'i Adım 3'teki gibi render eder. Önce eğitmen oturumunu oluşturup roomId'yi alın, sonra aynı oda için öğrenci oturumları üretin. Bir pano onu oluşturan istemciye aittir; başka bir istemci o pano için oturum üretemez.

shareUrlkayıtlı origin'lerinizden birinde olmalıdır — aksi hâlde istek 403 ile reddedilir. Göndermezseniz kopyalama düğmesi hiç gösterilmez. Token'lar 2 saatsonra dolar ve kayıtlı origin'inize bağlıdır.

iframe'i render edin (istemci tarafı)

<iframe
  id="eyena-board"
  style="width: 100%; height: 700px; border: none;"
  allow="camera; microphone; fullscreen"
></iframe>

<script>
  const res = await fetch('/api/my-board-session')     // kendi endpoint'iniz
  const { boardToken, roomKey } = await res.json()

  document.getElementById('eyena-board').src =
    `https://board.eyena.net/embed?token=${encodeURIComponent(boardToken)}#key=${roomKey}`

  window.addEventListener('message', (event) => {
    if (event.origin !== 'https://board.eyena.net') return
    switch (event.data?.type) {
      case 'eyena-board-ready':  console.log('oturum geçerli', event.data.roomId); break
      case 'eyena-board-joined': console.log('bağlandı:', event.data.role);        break
      case 'eyena-board-error':  console.warn('pano hatası', event.data.reason);   break
      case 'eyena-board-voice-error':
        console.warn('ses kullanılamıyor', event.data.reason);              break
    }
  })
</script>

allow="camera; microphone; fullscreen" zorunludur: camera göz takibi ve kalibrasyon için, microphone sesli konuşma için. Bir mesaja güvenmeden önce her zaman event.origin'i kontrol edin.

Faz 7 ile değişti. Ses özelliginden önce gömülen panolar allow="camera; fullscreen"ile belgelenmişti. O iframe'ler çalışmaya devam eder, ancak içlerinde ses mikrofon açamaz: tarayıcı öğrenciye hiç sormadan reddeder. Pano bu durumu eyena-board-voice-error / embed-permission-missing olarak bildirir.microphone iznini eklemek sorunu çozer.