Element iframe wideo YouTube 360 ​​nie działa w przeglądarce mobilnej

Question

Próbuję uzyskać osadzony element iframe, aby można było odtwarzać wideo YouTube 360 ​​na stronie mobilnej - działa poprawnie w przeglądarce na komputerze, ale w przeglądarce mobilnej widok stereoskopowy. Mogę potwierdzić, że zdecydowanie jest to odtwarzacz HTML5

Jest to wyraźnie nierozwiązany problem, z którym spotykają się inni. Poniżej wypowiedzi:

• https://productforums.google.com/forum/#!topic/youtube/7sk92Fs1juk
• Make Youtube 360 degree Videos work on mobile

Więc chcę pomóc z co najmniej jednego z tych dwóch potencjalnych pytań/rozwiązań.

1) Czy jest możliwe, aby działało to w ogóle w przeglądarce mobilnej? Dokumentacja Google sugeruje, że powinien

Dla porównania - tutaj jest mój kod iframe

<iframe width="1360" height="500" src="https://www.youtube.com/embed/0x16ngo8xfY?autoplay=1&loop=1&playlist=0x16ngo8xfY" frameborder="0" allowfullscreen></iframe> 

2) nie Zakładając, co jest najlepszym sposobem na życie moje iframe, aby uruchomić w aplikacji mobilnej YouTube, gdzie 360 film nie działa prawidłowo

Dzięki Alex

Answer 1

Biorąc pod uwagę brak innych odpowiedzi oraz w przypadku gdy ktoś inny znajdzie to, że uciekają się do tego (niestety) Sligh w efekcie rozwiązanie tymczasowe, które wydaje się działać.

if(window.innerWidth < 760){ 
    $('.video').on('click', function(e) { 
     e.preventDefault(); 
     //assumes that by forcing window to go to youtube will kick up option to open in app where experience works - plays my full showreel 
     window.location = "https://www.youtube.com/watch?v=0x16ngo8xfY&list=PLzSXIFcDqpiCiKXMtXtVIHnmor9uUsEhC&autoplay=1"; 
    }); 
    } 

Answer 2

Według YouTube 360 ​​wideo będzie działać na "najnowszej wersji Chrome, Opera, Firefox lub Internet Explorer na komputerze":

https://support.google.com/youtube/answer/6178631

Oznacza to, że możemy używać Użytkownika Wąchanie agenta, co jest zdecydowanie suboptymalne, ale nieco lepsze niż sprawdzanie innerWidth zgodnie z sugestią AlexHandy1.

function browserSupports360() { 
    // YouTube supports 360 videos in a limited set of browsers, 
    // see https://support.google.com/youtube/answer/6178631 

    var ua = navigator.userAgent; 

    // No mobile browser is supported at the moment 
    if (/Mobile/.test(ua) || /Tablet/.test(ua)) return false; 

    // Chrome >= 40 
    if (/Chrome\/[^123][0-9]/.test(ua) && !/Edge\//.test(ua) && !/OPR\//.test(ua)) return true; 

    // Firefox >= 40 
    if (/Firefox\/[^123][0-9]/.test(ua)) return true; 

    // Microsoft Edge 
    if (/Edge\//.test(ua)) return true; 

    // Opera >= 30 
    if (/OPR\/[^12][0-9]/.test(ua)) return true; 

    return false; 
} 

Jest kwestią otwartą na Forum pomocy YouTube z pytaniem, czy jest to możliwe do wykorzystania wykrywania funkcji zamiast można upvote go w nadziei, że ktoś z YouTube będzie patrzeć na to:

https://productforums.google.com/forum/#!topic/youtube/EON00C4h9w4

Answer 3

Jest to prosty, Zobacz element inspekcji (chrome) na youtube na wideo 360. Zobaczysz, że to nie jest odtwarzacz wideo. To jest płótno z webgl.

Gdy Google chce pracować na telefonie komórkowym, możesz go odtworzyć. Zanim to nastąpi, musisz utworzyć własny odtwarzacz wideo 360. Przepraszam na moim złym en!

Spójrz:

http://threejs.org/examples/#canvas_geometry_panorama

Musisz zrobić WebGL panorama aplikację z strumieniowych tekstur i yuo dostanie 360 ​​filmów. Musisz użyć wariantu panoramy nie sferycznej kuli.

Nie można użyć znacznika wideo - 100%.

Naprawianie na pulpicie firefox: dotarłem do: config na pasku adresu w firefoxie i ustawiłem webgl-disabled na false .... Nawet jeśli zainstalujesz aktualizację do ostatniej wersji na firefoxie, nadal musisz to zrobić. Jeśli odinstalujesz - zainstaluj nową wersję firefox i domyślnie webgl jest włączony.

Answer 4

Udało mi się uzyskać 360 wiz wideo w Androidzie WebView, zmieniając agent użytkownika tak, aby pasował do mojego MacBooka. Oto używane:

Mozilla/5.0 (Macintosh; Intel Mac OS X 10_10_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/50.0.2661.86 Safari/537.36 

Pełna implementacja składa się z VideoJS i rozszerzenia YouTube, które używa elementu iframe. Dotknięcie/przeciągnięcie nie jest jeszcze doskonałe, ale był to krok we właściwym kierunku.

Być może można przesłonić userAgent nawigatora JS, aby uzyskać ten sam wynik.