Wideo krzyżowe w Safari

Question

Czy ktoś wie, czy Safari obsługuje atrybut crossorigin w tagu HTML5 <video>? Obsługuję wideo z serwera, który odpowiada wszystkimi potrzebnymi nagłówkami CORS, i używam poniższego znacznika, aby osadzić wideo na mojej stronie. Strona jest wyświetlana z innej domeny.

 
<video controls crossorigin="anonymous" src="http://example.com/movie.mp4"> 

Następnie narysuj film na płótnie i pobierz obraz z obszaru roboczego za pomocą interfejsu API toDataURL. Działa to w przeglądarce Chrome i Firefox, ale Safari zgłasza błąd bezpieczeństwa, tak jakby w filmie nie było atrybutu crossorigin.

Wszelkie pomysły?

Answer 1

Wygląda na to, że Safari nie obsługuje atrybutu crossorgin, ale nie mogę znaleźć niczego oficjalnego. Istnieje ten tweet https://twitter.com/sonnypiers/status/187513545397776384 z obejściem obrazów, ale nie sądzę, że pomaga w przypadku wideo.

Answer 2

Na początek potrzebujesz CORS? Linkowanie do niego wydaje się działać na safari. Próbowałem go za pomocą htmlinstant.com

<video src="http://www.quirksmode.org/html5/videos/big_buck_bunny.mp4" controls /> 

Jeśli potrzebujesz CORS, a następnie dodaje się strona twierdzi, że poparcie dla niego dodano w maju 2011 roku nie zostało przetestowane go jednak. https://developer.mozilla.org/en-US/docs/HTML/CORS_settings_attributes

Na przykład z filmu na płótnie, patrz punkt 5.4 pod tym linkiem: http://www.html5rocks.com/en/tutorials/video/basics/ Przetestowałem i działa w moim safari.

Answer 3

Z naszych testów safari nie obsługiwały crossdomain. Dodajemy atrybut crossorigin, aby używać COR w żądaniach audio (będzie raportować, jak to działa).

Zabawne, jak crossdomain wydawał się działać dobrze pod http, ale nie pod https. Jeśli czytasz specyfikację w3 dla znaczników audio/wideo (zwanych znacznikami medialnymi), oznacza to, że podlegały one ograniczeniom między domenami.

Wsparcie CORS w tagu dźwięku: https://developer.mozilla.org/en-US/docs/HTML/CORS_settings_attributes

Teraz inny Ciekawostką jest fakt, że został safari wyborze rodzaju myme na podstawie rozszerzenia pliku (co?). Plik z rozszerzeniem * .mp4 jako rozszerzonym grał dobrze. Ten sam plik, którego nazwa została zmieniona, na coś innego nie.

Answer 4

Oto obejście wideo:

      $.ajax({ 
          type: 'get', 
          url : videoUrlFromAnotherDomain, 
          crossDomain: 'true', 
          success: function(data) { 
           // get a base64 version of the video! 
           var base64 = window.btoa(data); 
           // get a new url! 
           var newURL = 'data:video/mp4' + ';base64,' + base64; 
           // set the src on the video source element to the new url 
           video.find("source").attr("src", newURL); 
          } 

Zastępca niezależnie od typu filmu jest dla "video/mp4" w NEWURL.