O atributo <video>
tags autoplay="autoplay"
funciona bem no Safari.
Ao testar em um iPad, o vídeo deve ser ativado manualmente.
Eu pensei que era um problema de carregamento, então executei um loop para verificar o status da mídia:
videoPlay: function(){
var me = this;
console.log('STATE: ' + $("#periscopevideo").get(0).readyState);
if ($("#periscopevideo").get(0).readyState != 4){
setTimeout(function(){me.videoPlay();}, 300);
}
else {
$("#periscopevideo").get(0).play();
}
}
O estado permanece no 0
iPad. No meu safari desktop, ele passa por 0
, 1
e, finalmente 4
. No iPad, ele só alcança 4
se eu tocar manualmente na seta "reproduzir".
Além disso, chamar $("#periscopevideo").get(0).play()
de um clique via onClick
também funciona.
Existe alguma restrição da Apple em relação à reprodução automática? (Estou executando o iOS 5 ou superior a propósito).
Respostas:
atualização para iOS 10
A proibição da reprodução automática foi suspensa a partir do iOS 10 - mas com algumas restrições (por exemplo, A pode ser reproduzida automaticamente se não houver faixa de áudio).
Para ver uma lista completa dessas restrições, consulte os documentos oficiais: https://webkit.org/blog/6784/new-video-policies-for-ios/
iOS 9 e anterior
A partir do iOS 6.1, não é mais possível reproduzir automaticamente vídeos no iPad.
Minha suposição sobre por que eles desativaram o recurso de reprodução automática?
Bem, como muitos proprietários de dispositivos têm limites de uso / largura de banda de dados em seus dispositivos, acho que a Apple achou que o próprio usuário deveria decidir quando iniciaria o uso da largura de banda.
Após algumas pesquisas, encontrei o seguinte extrato na documentação da Apple em relação à reprodução automática em dispositivos iOS para confirmar minha suposição:
Aqui está um aviso separado, apresentado na página de Referência HTML5 do Safari, sobre por que a mídia incorporada não pode ser reproduzida no Safari no iOS:
O que isso significa (em termos de código) é que o Javascript
play()
e osload()
métodos ficam inativos até o usuário iniciar a reprodução, a menos que o métodoplay()
ouload()
seja acionado pela ação do usuário (por exemplo, um evento de clique).Basicamente, um botão de reprodução iniciado pelo usuário funciona, mas um
onLoad="play()"
evento não.Por exemplo, isso reproduziria o filme:
Enquanto o seguinte não faria nada no iOS:
fonte
Quero começar dizendo que sei que essa pergunta é antiga e que já tem uma resposta aceita; mas, como um infeliz usuário da Internet que usou essa pergunta como um meio de acabar apenas provando estar errado logo depois (mas não antes de incomodar um pouco meu cliente), quero acrescentar meus pensamentos e sugestões.
Enquanto @DSG e @Giona estão corretos, e não há nada errado com suas respostas, há um mecanismo criativo que você pode empregar para "se locomover", por assim dizer, essa limitação. Isso não quer dizer que eu esteja tolerando a contornar esse recurso, muito pelo contrário, mas apenas alguns mecanismos para que um usuário ainda "sinta" como se um arquivo de vídeo ou áudio estivesse "tocando automaticamente".
A solução rápida é ocultar uma tag de vídeo em algum lugar da página para celular, já que criei um site responsivo e faço isso apenas para telas menores. A tag de vídeo (exemplos HTML e jQuery):
HTML
jQuery
Com isso oculto na página, quando um usuário "clica" para assistir a um filme (ainda não há interação com o usuário, não há como contornar esse requisito), em vez de navegar para uma página de exibição secundária, carrego o vídeo oculto. Isso funciona principalmente porque a tag de mídia não é realmente usada, mas promovida para uma instância do Quicktime, portanto, não é necessário ter um elemento de vídeo visível. No manipulador de "clique" (ou "touchend" no celular).
E viola. No que diz respeito ao UX, um usuário clica em um vídeo para reproduzir e o Quicktime abre a reprodução do vídeo escolhido. Isso permanece dentro da limitação de que os vídeos só podem ser reproduzidos por meio da ação do usuário, por isso não estou forçando dados de quem não está decidindo assistir a um vídeo com este serviço. Eu descobri isso ao tentar descobrir como exatamente o YouTube conseguiu isso com seus dispositivos móveis, que é essencialmente uma construção de página Javascript muito boa e um elemento sofisticado escondido como no caso da tag de vídeo.
Aqui está uma "solução alternativa" para tentar criar um recurso UX de "reprodução automática" em dispositivos iOS sem ultrapassar as limitações da Apple e ainda fazer com que os usuários decidam se desejam assistir a um vídeo (ou áudio mais parecido, embora eu não testaram) sem ter apenas um carregado sem a permissão deles.
Além disso, para a pessoa que comentou que é do sleep.fm, infelizmente isso ainda não teria sido uma solução para seus problemas, que é a reprodução de áudio com base no tempo.
Espero que alguém ache essas informações úteis, pois isso me salvaria uma semana de entrega de más notícias a um cliente inflexível quanto a esse recurso e fiquei feliz em encontrar uma maneira de entregá-lo no final.
EDITAR
Achados adicionais indicam que a solução alternativa acima é apenas para dispositivos iPhone / iPod. O iPad reproduz vídeo no Safari antes de ser exibido em tela cheia; portanto, você precisará de algum mecanismo para redimensionar o vídeo ao clicar antes de reproduzir, ou então você terminará com áudio e sem vídeo.
fonte
$dummyVideo.get(0)
vez de colchetes, para que o jQuery possa falhar normalmente se sua seleção estiver vazia.Basta definir
webView.mediaPlaybackRequiresUserAction = NO;
A reprodução automática funciona para mim no iOS.
fonte
A partir do iOS 10, os vídeos agora podem ser reproduzidos automaticamente, mas apenas eles são silenciados ou não têm faixa de áudio. Yay!
Em resumo:
<video autoplay>
elementos agora respeitarão o atributo de reprodução automática, para elementos que atendam às seguintes condições:<video>
os elementos poderão reproduzir automaticamente sem um gesto do usuário se a mídia de origem não contiver faixas de áudio.<video muted>
também será permitido que os elementos sejam reproduzidos automaticamente sem um gesto do usuário.<video>
elemento obtiver uma faixa de áudio ou ficar sem som sem um gesto do usuário, a reprodução será interrompida.<video autoplay>
os elementos só começarão a ser reproduzidos quando visíveis na tela, como quando são rolados para a janela de visualização, tornados visíveis por meio de CSS e inseridos no DOM.<video autoplay>
os elementos serão pausados se ficarem invisíveis, como rolando para fora da janela de exibição.Mais informações aqui: https://webkit.org/blog/6784/new-video-policies-for-ios/
fonte
Nesta referência do Safari HTML5 , você pode ler
fonte
Deixe o vídeo silenciado primeiro para garantir a reprodução automática no ios e, em seguida, ative o som, se desejar.
fonte