How are you doing?
Well. I'm running 3 videos on my website - HTML5
1st video > Specs: 4K 3840 × 2160 pixels - .WebM format
2nd video > Specs: FullHD 1080p 1920 x 1080 pixels - .WebM format
3rd video > Specs: FullHD 1080p 1920 x 1080 pixels - .mp4 format
As known .webm has compatibility pratically with all browsers.
I made a really simple test to check which browser has compatibility with .webm
Selected browsers for the test I've done:
Google Chrome, Safari, Firefox, Opera and Microsoft Edge.
1st test:
Browsers that definitely have compatibility with .webm after playing the video on my website:
Google Chrome, Firefox, Opera and Microsoft Edge. (Definitely, Safari is the only not acceptable)
2nd test:
Browsers that definitely worked on 4K .WebM:
Google Chrome, Opera and Microsoft Edge.
3rd test:
Browsers that definitely worked on 1080p .WebM:
Google Chrome, Firefox, Opera and Microsoft Edge.
4th test:
Browsers that definitely worked on 1080p .mp4:
Google Chrome, Safari, Firefox, Opera and Microsoft Edge.
Conclusion: From the list (Google Chrome, Safari, Firefox, Opera and Microsoft Edge) all browsers can play .webm format, except safari.
From the list of browsers that can play .webm (Google Chrome, Firefox, Opera and Microsoft Edge), all of them can run 4K. Only Firefox doesn't accept 4K .webm (firefox only accepts 1080p .webm)
Safari definitely can't run .webm format.
If you wanna check the tests I've done by yourself, please access my website link: http://167.71.100.135
Here is the point:
I'm definitely fine that Safari doesn't work with .webm
What I really don't "accept" is the way Firefox goes. Does anyone
knows why Firefox can't run on 4K .webm? As mentioned before, maximum
resolution I could get on firefox was 1080p .webm
Does anyone know how to make it works on 4K .webm? I'm really not satisfied with maximum firefox 1080p .webm, knowing that all others browsers do the 4K job.
Thank you very much!
I value your feedback, so let me know what you think!
Sincerely,
Mat
How are you my friend?
Yes, the video 4k is 3.8GB, 2k is 1.5GB and 1080p 800MB.
Exactly, the videos are an hour long and I can play smoothly the 4K video using any browser (chrome, opera and microsoft edge). I can't play only on firefox. (Firefox only accepts only max 1080p)
Oh yeah, I tried with a shorter video for sure. It's a 5min 4k (600mb) video and firefox doesn't accept... here is the link, you can try by yourself, please: http://167.71.100.135/5min-4k-600mb
Look forward to hearing from you.
Sincerely,
Mat
Do these videos play if you just open them locally in the browser? The videos are an hour long, and the 4k video is 3.8 GB, the 2K is 1.5 GB and the 1080p is 800 MB.
Perhaps trying with a shorter video? I am able to play a 600MB 4k video in Firefox opening from localhost.
Have you thought about streaming a video of this size?
EDIT:
Looking at the 3 videos with FFprobe, the 4k and 2k videos are VP9 encoded, and the 1080p is h264 encoded. You should standardise the encoding on all 3 videos, to ensure that it really is the size, and not the encodings:
https://www.streamclarity.com/probe?url=http://167.71.100.135/wp-content/uploads/media/webm1080p.webm
Related
I currently have an iPhone that is connecting to a browser via WebRTC and from that browser I have other additional browser windows connected via webRTC that preview the same video stream.
iPhone > Safari Desktop (video works) > Chrome/Firefox/Safari Desktop works great
iPhone > Firefox (video works) > Chrome/Firefox/Safari Desktop works as well
iPhone > Chrome (video works) > Chrome/Firefox/Safari display a black video
My issue is a little hard to explain so I've created an image to help illustrate the issue:
The crazy thing is it works when the source is an Android device or another browser. Is it possible that iOS Safari is limiting the WebRTC stream to the first browser? Is there a way to debug why Chrome is displaying black instead of the video?
It looks like this is a known issue with Chrome and H264:
https://bugs.chromium.org/p/chromium/issues/detail?id=1073828&q=black%20h264&can=2
When I disable H264 it works so I will run with that for now. Unfortunately that means we miss out on the benefits of H264 hardware encoding/decoding.
I'm having WebRTC usability issue in Opera (55.0.2719.50560) and Firefox (68.3.0) on Android (Samsung Galaxy S6).
Firefox problem: is asking me multiple (around 3) times about permission to use camera. Also is asking me all the time which camera I want to use (regardless that constrains are set)
Opera: is asking me multiple times (around 3) which camera I want to use (regardless of constraints).
Exactly the same code is working properly on the same phone on Chrome and using Safari and Chrome on iPhone.
All content is served using https.
Thank you for any suggestions.
I created an AWS Cloudfront distribution for my mp4 files hosted on S3. The Cloudfront distribution points to the S3 origin of the mp4 files.
I have an HTML5 website that plays these mp4 files in the code but I noticed that some of the mp4 files did not play on certain Android and iPhone devices.
When I tried opening the Cloudfront URL for the mp4 files that were not playing, the result was the same; so the problem might not be in my HTML5 video code, it might be some mp4 files could be incompatible with certain devices.
For testing purposes following are two URLs for mp4 files hosted on Cloudfront, the first one works on all browser versions (Desktop, Android, iPhone). The second one works on
1).http://djkvzdnel0qlh.cloudfront.net/prepare_booster/2+AUDIO+Prepare+Booster/EventPrep_M01_P01.mp4
Works on:
Desktop browsers
Android browsers
iPhone browsers
2).http://djkvzdnel0qlh.cloudfront.net/explore_support/3+AUDIO+Explore+Support/stress/AAA_MS_BF_SET_1145.mp4
Works on:
iPhone 5S - iOS ver 12.1.4 - Safari browser.
iPhone 6S: - iOS ver 12.1.4 - Safari browser.
iPhone X
Newer iPad Mini - iOS ver 12.1 - Safari browser.
Newer iPad Mini - updated to iOS ver 12.1.4 - Safari browser.
Older Full Size iPad - iOS ver 9.3.5 (up to date for this unit)
Very old iPod Touch - iOS ver 9.3.5 (up to date for than unit) - Safari browser.
DOES NOT work on:
Samsung A5 - Android 8.0.0 - Firefox, Samsung browser, Chrome tested
iPhone XS
iPhone XS Max
iPhone XR
Need help to know why I am having problems with the second mp4 file. If anyone could point me in the right direction, I would appreciate it.
Try to give the second video a resolution of at least, say, 80x60.
I have MP4 videos, all encoded with the same settings. The first 9 work properly in IE, Chrome and Firefox. The 10th video's default dimensions are 5184x3456px. IE and Firefox refuse to render this MP4 in their players, but Chrome continues to work properly like the first 9. Does anybody know if it is because of the larger default dimensions of the video? Is there a workaround for this issue?
For some reason I can't get IE9/10 to play video that is taller than wide, when using HTML5 video tags.
Demo:
http://s.l6.no/demo/video+html5/
The demo shows one video scaled down from 1280x720, which plays perfectly fine in all tested browsers, and one video scaled down from 720x1280 which plays for all browsers but IE9/10.
Tested and works for:
Chrome 26, Windows 7 64-bit
Chromium 24, Ubuntu 64-bit
Firefox 14, Windows 7 64-bit
Tested and does not work for:
Internet Explorer 9, Windows 7 64-bit
Internet Explorer 10, Windows 7 64-bit
I'm using FFmpeg to code the videos to MP4(x264) and WebM(VP8), with the current command dummed down to this:
ffmpeg -i in.mp4 -vcodec libx264 -pix_fmt yuv420p -y -b:v 4000k out.mp4
The lack of profile settings would be my first point, but since the other video is playing just fine, I can't see why it should matter.
Any ideas?
Edit: soft rotating the video isn't really an option, as the user is to be able to download the video to play offline. I could transcode an extra version just for IE, but come on, there's gotta be another way, no?
It's a bit ugly, but you could add -webkit-transform:rotate(90deg); to the style attribute of the video tag. However, this rotates your controls as well.
The problem is the video height.
It has to be less than 1088 pixels.
More here