<video> plays in other browsers, but not Safari
Solution 1
Safari requires webserver to support "Range" request header in order to play your media content.
For a legit "Range" request response, your webserve need to return status code "206".
Solution 2
I had a similar problem with audio. The solution was to add the source tag, to the audio tag. Can you try in your case the following:
<video loop controls='true' width='100%' height='100%'>
<source src='//some_video.mp4' type='video/mp4'>
</video>
Solution 3
I uploaded a new MP4 file, but it played in SAFARI only (on both my MAC and my iPhone), not Chrome, Oasis, Firefox, or Brave. HTML code was identical to previous successes. File size and Dimensions were fine. But the Codecs on the old, working files were "H.264, AAC". The Codecs on the new, not working files were "MPEG-4, AAC". I edit my video files on VideoPad. So I looked at the specification selections on the "Export file as" options, and, sure enough, the Codecs was defaulted to MPEG-4. I selected H.264 and exported the file. Uploaded to AWS and made public. Retried my new files in the four failure browsers and BINGO!, they all worked. There is a God!
Solution 4
Make sure controls='true' type='video/mp4' is given in your html code.
<video loop controls='true' width='100%' height='100%' src='//some_video.mp4' type='video/mp4'></video>
Solution 5
This could indeed be an issue of missing byte-range support, depending on the version you are using. It was added to the DMSDownloadServlet in MAGNOLIA-3855 (Magnolia fix version 4.4.6).
Katana314
Wondering why the this keyword in your function() suddenly doesn't refer to what you think it does? Take a knee, kid. I've been working in JavaScript for most of my professional career. I have professional experience with JQuery and Dojo, but have a talent for adapting to new frameworks or building reusable mini-frameworks. I can work with most languages with minimal startup time, but when given a choice I love C#'s functional structure. So far, I don't think I've ever been hired for a framework I already knew. I'm a sucker for video games with unique story or gameplay premises. I enjoy making projects like machinima and writing samples in my downtime, and sometimes toy with the Unity engine.
Updated on September 16, 2021Comments
-
Katana314 over 2 years
We have an MP4 video on our site; it plays fine in IE9+, Firefox, Chrome, and Chrome on mac. However, on Safari, the video doesn't play at all - it does trigger a "stalled" event and then nothing loads. I would post our HTML, but I traced the problem further by finding that Safari wouldn't play it even when navigating to the original MP4's URL. When downloaded and played locally, the video works fine in Quicktime.
The weirdest part of this is that of all our developers, I can get the video to work on Safari when I run the related server from my development computer. What's more, other MP4 files in the same directory have a similar problem. This has been the key to me, and I've been searching for any little difference in the way the videos transfer from the server - request/response headers, exact filesize, etc.
Headers copied from Chrome (only since Safari is harder to copy/paste from)
Accept:text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8 Accept-Encoding:gzip, deflate, sdch Accept-Language:en-US,en;q=0.8 Cache-Control:max-age=0 Connection:keep-alive DNT:1 Host:*************:8443 User-Agent:Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/39.0.2171.95 Safari/537.36 Response Headers Accept-Ranges:bytes Content-Length:44875102 Content-Type:video/mp4;charset=UTF-8 Date:Tue, 30 Dec 2014 21:11:51 GMT ETag:W/"44875102-1419959755000" Last-Modified:Tue, 30 Dec 2014 17:15:55 GMT Server:Apache-Coyote/1.1
(Also, just in case this reminds you of an older issue; I'm aware Safari on Windows has been dead for ages. This issue is occurring on OS X)
EDIT: New info that might help a bit. I took a personal video from my own webserver, which was able to work from there on the problematic Safari browsers in question, and downloaded it to our server's local video directory. From there, it encounters the same issue as our other videos. This suggests to me that the MP4 itself may not matter - this is probably a server issue of some sort with our Tomcat 7 webserver. We do have the Content-Types registered correctly, which at least covers the basics, but I am curious if there are other necessary parts.
MORE INFO: I didn't think to mention this initially, but we are loading our webpages and videos over an HTTPS connection. Most of our test servers do not have valid certificates, and so we need to click through the standard browser warning that "This server might not be who it says". We are now looking into what it would take to have correct certificates on all our servers.
-
Katana314 over 9 yearsWhat's really annoying is that I'd like an easy way of confirming this, but in Safari's developer tools, when I click on the network request for the MP4 file, it incorrectly claims that there were no request or response headers. Maybe I'll find another way of verifying.
-
Nexii Malthus over 9 yearsNo chance of a test link? Private message me if need be (twitter = @nexii)
-
Katana314 over 9 yearsHm...To my knowledge, 'controls' is a boolean attribute, meaning it doesn't need
='true'
, and no resource I know of mentions a 'type=etc' attribute on the video tag. I never did give my HTML itself, but basically I have it very similar to yours, except with the src / type defined inside asource
element inside the video. -
Katana314 over 9 yearsIt's not an apache server, so not htaccess. It does have the MIME types through other configuration files, though.
-
designosis over 9 yearsif you save the generated HTML as an html file, and load that into Safari (after fixing any broken urls), does it work?
-
Katana314 over 9 yearsNo; it doesn't even work if the video url is loaded directly in the browser.
-
John Hua over 9 years@Katana314 I agree with you in most of cases but not this one.
-
Katana314 over 9 years@huazihihao Agree about what?
-
nelsonic about 7 yearswhat was the conclusion? did anyone get this working?
-
Austin Burk over 6 yearsThis is true. It also means you have to either add an extra layer (e.g. Varnish or Nginx) or completely reimplement range handling in your application code for dynamically generated or converted content.
-
Gaurav Sharma about 6 years
type="*"
was the catch -
David over 4 yearsSafari is rubbish with streamed media mime types. It ignores the MIME type and looks at the file name extension instead. Getting the MIME type right is good for other browsers but fruitless for Safari.
-
Sibeesh Venu over 4 yearsAnyone found this answer helpful?
-
chovy over 3 yearsmy server does this. still can't play on Safari.
-
OdraEncoded almost 3 years"iOS supports movies larger than 2 GB" meanwhile it has issues playing a 50kb gif video because of this odd requirement...