İPhone veya Android'de HTML5 ile yerel tam ekran video oynatıcıdan kaçınabilir miyim?


130

Çalışan videoyla senkronize edilmiş diğer içerikleri oluşturan HTML5 etiketini ve JavaScript kodunu kullanan bir web uygulaması oluşturdum. Masaüstü tarayıcılarda harika çalışıyor: Firefox, Chrome ve Safari. Bir iPhone veya DroidX'te, yerel video oynatıcı açılır ve ekranı ele geçirir, böylece videoyla aynı anda görüntülemek istediğim diğer dinamik içeriği karartır.

Bunun etrafında herhangi bir yol var mı? Gerekirse, bu iki platform için de yerel uygulamaları nasıl yazacağımı bulacağım, ancak HTML5 / JavaScript ile devam edebilseydim, bu bana bir ton çaba kazandırırdı.


1
Aslında, a / v oyuncularının hem ios hem de android'deki tarayıcı uygulamaları cehennem gibi hatalı. Sayfadaki birkaç oyuncuyu deneyin veya onlara şık kontroller eklemeye çalışın ve göreceksiniz - kullanılamaz. Yani, muhtemelen video oynatmak için harici tam ekran uygulama - o kadar da kötü değil;)
tuxSlayer

1
Apple cihazları içeriğimi amaçlanan şekilde her oluşturduğunda mutlu oluyorum. Bunu kutlamak için kullanırım.
Anders Lindén

Teknik olarak hayır, ancak bunu mümkün kılan birkaç kitaplık var , örneğin iphone-inline-video (açıklama: ben yazdım)
fregante

Yanıtlar:


74

İOS 10+ sürümünde

Apple, özelliği playsinlineiOS 10'daki tüm tarayıcılarda etkinleştirdi , bu nedenle bu sorunsuz bir şekilde çalışıyor:

<video src="file.mp4" playsinline>

İOS 8 ve iOS 9'da

Kısa cevap: iphone-inline-video kullanın , satır içi oynatmayı etkinleştirir ve sesi senkronize eder.

Uzun cevap: Videoyu gerçekten görmek yerine gözden geçirerek oynatmayı simüle ederek bu sorunu aşabilirsiniz.play() .


Captive Network Assistant'ta (Captive Portal) çalışmıyor
Dominik Vogt

54

İOS web tarayıcısında satır medya oynatmayı etkinleştiren / devre dışı bırakan bir özellik vardır (yerel bir uygulama yazıyorsanız, bu allowsInlineMediaPlaybackbir UIWebView özelliği olacaktır ). İPhone'da varsayılan olarak bu olarak ayarlanmıştır NO, ancak iPad'de ayarlanmıştır YES.

Neyse ki, bu davranışı HTML'de aşağıdaki gibi ayarlayabilirsiniz:

<video id="myVideo" width="280" height="140" webkit-playsinline>

... umarım sizin için çözer. Android cihazlarınızda çalışıp çalışmayacağını bilmiyorum. Bu bir webkit özelliği, öyle olabilir. Her neyse, gitmeye değer.


25
Önerin için teşekkürler. Ne yazık ki, gördüğüm davranışı değiştirmedi - hem iPhone hem de DroidX'te tam ekran yerel video oynatıcılar açılır.
AlpineCarver

5
Ben de bu sorunu yaşıyorum. Webkit-playsinline'ı ve hatta webkit-playsinline = "webkit-playsinline" ın xml onaylı sürümünü ekledim, ancak davranışı değiştirmedim
mike clagg

7
Web görünümü satır içi video oynatmaya izin vermediğinden bu iPhone için Safari'de çalışmayabilir. Bununla birlikte, web sayfası kendi uygulamanızda kendi UIWebView içinde barındırılıyorsa, bu özellikleri ayarlayabilirsiniz ve satır içi video oynatma mümkün olacaktır: webview.allowsInlineMediaPlayback = YES; webview.mediaPlaybackRequiresUserAction = HAYIR;
Willster

14
Bu, Cordova / PhoneGap'te de çalışır. Cordova projenizdeki config.xml dosyanıza aşağıdakileri eklemeniz yeterlidir:<preference name="AllowInlineMediaPlayback" value="true" />
Bay TA

3
<preference name = "AllowInlineMediaPlayback" value = "true" /> Harika !. iPhone'umda iyi çalışıyor. Çok teşekkürler.
sirius2013

41

Eski cevap (2016'ya kadar geçerli)

Bunu açıkça söyleyen bir Apple geliştirici bağlantısı var -

küçük ekranlı cihazlar olan iPhone ve iPod touch'ta "Video Web Sayfasında GÖSTERİLMİYOR "

Safari Cihaza Özgü Hususlar

Seçenekleriniz :

  • Bu webkit-playsinlineözellik, iOS'taki HTML5 videoları için çalışır, ancak yalnızca web sayfasını ana ekranınıza web uygulaması olarak kaydettiğinizde çalışır - Safari'de bir sayfa açılmazsa
  • Bir WebView'da ile yerel uygulamalar (ya da HTML, CSS, JS ile melez bir app) için UIWebViewyalnızca ama eğer videoyu çevrimiçi olarak oynamaya izin verir set allowsInlineMediaPlaybacközellik için UIWebViewtrue sınıfa

1
Kabul edilen cevaba yorumlarımı görün. ICYMI, Cordova için config.xml dosyanıza aşağıdakileri ekleyin:<preference name="AllowInlineMediaPlayback" value="true" />
Bay TA,

YouTube.com'da tam ekrana geçmeden oynatılıyor
Anthony

Cevap eski, 2014 ve işler değişmiş olabilir. Ayrıca youtube.com, yanıtta belirtildiği gibi WebView'a sahip yerel bir uygulama değildir . Yine de fark ettiğin için teşekkürler.
KingJulian


11

Bu sayfaya göre https://developer.apple.com/library/archive/documentation/AppleApplications/Reference/SafariHTMLRef/Articles/Attributes.html , yalnızca (Yalnızca allowInlineMediaPlayback özelliği YES olarak ayarlanmış bir UIWebView'da etkinleştirilmişse kullanılabilir. ) Mobil Safari'de bunun iPad için EVET, iPhone ve iPod Touch için HAYIR olduğunu anlıyorum.


4
Görünüşe göre bu, yalnızca bir HTML5 oynatıcı sayfasını yerel bir iOS uygulamasında "yaşamak" için ayarlıyorsanız işe yarayacak. Kesinlikle düz bir web sayfasında çalışmıyor.
natlee75

9

Android hakkında bilgim yok, ancak iPhone veya iPod touch'taki Safari, küçük ekran boyutu nedeniyle tüm videoları tam ekran oynatacak. İPad'de videoyu sayfada oynatacak ancak kullanıcının tam ekran yapmasına izin verecektir.

Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.