Conexão automática de um vídeo incorporado à IFrame API
Normalmente, você cria um player por create()
. Se já houver um iframe na página, conecte a API a ele automaticamente.
Siga estas etapas:
- Adicione o parâmetro de URL
?autoao script da IFrame Player API. - Adicione o parâmetro de URL
?enableIframeApiaosrcde cada<iframe>de vídeo.
O handler
onKinescopeIframeAPIReady é executado quando cada player é criado. Se a página tiver vários vídeos com enableIframeApi, assine playerFactory.Events.Created para processar todas as instâncias.Exemplo
<!doctype html>
<html>
<head>
<!-- Script da IFrame Player API com o parâmetro ?auto:
todos os elementos <iframe> correspondentes na página se conectam à API.
defer executa o script após a análise do HTML. -->
<script defer src="https://player.kinescope.io/latest/iframe.player.js?auto"></script>
<script>
function onKinescopeIframeAPIReady(playerFactory) {
playerFactory.on(playerFactory.Events.Created, ({ data: player }) => {
player.setVolume(0.5)
})
}
</script>
</head>
<body>
<!-- enableIframeApi permite a conexão com a IFrame API -->
<iframe
src="https://kinescope.io/embed/VIDEO_ID?enableIframeApi"
allow="autoplay; fullscreen; picture-in-picture; encrypted-media; gyroscope; accelerometer; clipboard-write; screen-wake-lock;"
style="border: none;"
></iframe>
</body>
</html>
Próximos passos
- Controle do player — métodos e eventos após a conexão
- Incorporação simples com iframe — iframe e parâmetros de URL
- Criação de um player
— fluxo padrão com
create()