iFrames

Trate dados de atividade que vivem dentro de quadros incorporados.

Configurar uma presença em iFrame

Adicione o padrão de URL dos frames aninhados em metadata.json:

{
  "iframe": true,
  "iFrameRegExp": "player\\.example\\.com/embed/"
}

Crie um arquivo iframe.ts ao lado de presence.ts. Ele será executado nos frames aninhados correspondentes:

const iframe = new iFrame()

iframe.on("UpdateData", () => {
  const video = document.querySelector("video")
  if (!video) return

  iframe.send({
    video: {
      paused: video.paused,
      currentTime: video.currentTime,
      duration: video.duration,
      title: document.querySelector(".video-title")?.textContent,
    },
  })
})

Receba os dados em presence.ts:

presence.on("iFrameData", (data) => {
  iFrameData = data
})

iFrameData é emitido uma vez por mensagem. Com vários frames, identifique ou combine os dados na presença principal. iFrameRegExp é comparado com a URL do frame aninhado.

Abordagem recomendada

Use a manipulação de iframes apenas quando a página principal não conseguir acessar o estado necessário.

Prefira seletores DOM estáveis, elementos de mídia e estado público da página antes de adicionar lógica de iframe.

Segurança

Evite coletar dados pessoais ou sensíveis de frames. Uma presença deve enviar apenas informações de atividade úteis para a Discord Rich Presence.