Some mp4 videos are not playing in video.js - video.js

I can't play few mp4 video with mp4v codecs. Other mp4 videos with .avc plays fine. is this a bug or i am missing something? Can you please help?

If only some files won't play, these files may be encoded the wrong way. Check, if the videos are being played directly by the browser, without VideoJS and if this isn't the case, check their encoding (for example with http://mediaarea.net/de/MediaInfo).

Related

S3 video play in edge and react native but not chrome or firefox

one of the user of the app I work for has an issue, all the video she upload doesn't work in an HTML5 video player, except on Edge and Safari for iOS (and if it works there I assume it could work in other browsers)
The video can be played in our react-native app or after being downloaded, but not directly using the S3 or cloudfront link
Since the vieos from the other users work, I'm assuming it's related to encryption and S3 specifications, does anyone have met this problem and found a solution ?
EDIT: forgot to put a sample link
https://video-reetags.s3.eu-west-3.amazonaws.com/compressed/aed0a512a419334fe5d0c0c6fb4094a21610642052.mp4
Since the videos from the other users are working fine, I'm assuming it's related to encryption and/or S3 specifications...
No, the problem is not encryption or S3 server issues.
Your MP4 container has video in HEVC format (aka H.265), which is not supported in Chrome or Firefox. You should still be able to hear the sound part since AAC audio is supported.
Playing the video is possible with React-Native and other (native) video players because they rely on the O.S running the player App to decode video. If a browser brand didn't buy a license for HEVC then that browser cannot play it.
Solution:
Re-encode such videos to MP4 containing H.264 with AAC audio (...not H.265 with AAC).
Re-encoding takes time but it's the only way for now. Either the user does it before any uploading, or your own app accepts any file and re-encodes the "not supported" ones on server-side (eg: using FFmpeg or GStreamer tool).

HTML Video: Is it possible to fallback to HLS for lack of DASH/Webm-VP9 support on Safari, or how do I support both Webm and H264 on DASH?

I'm trying to serve some video content from a webserver, with the intention of supporting a reasonably wide set of browsers.
For iOS, as far as I can tell the way to go is to use HLS (HTTP Live Streaming) whereas on the desktop (and I guess Android?) MPEG-DASH is the state of the art. As a fallback I can provide a few static videos.
I've got this working on iOS with HLS and Chrome, Firefox, Opera, and Edge on desktop, but Safari on Mac just shows an activity spinner when I press play. As far as I can tell, this is because Safari tries and fails to use DASH as the playback method despite lack of Webm support and HLS being listed first.
For MPEG-DASH I have used Webm with VP9 and Opus, and my <video> tag looks something like this:
<video controls style="display:inline-block;max-width:174.22vh;max-height:98vh;width:98vw;height:55.125vw;background-color:#ccc;" preload="auto" poster="my-preview-image.jpg" data-dashjs-player>
<source src="myvideo/hls/playlist.m3u8" type="application/x-mpegURL">
<source src="myvideo/dash/manifest.mpd" type="application/dash+xml">
<source src="myvideo/myvideo-vp9.webm" type="video/webm; codecs=vp9,opus">
<source src="myvideo/myvideo-vp8.webm" type="video/webm; codecs=vp8,vorbis">
<source src="myvideo/myvideo-h264.m4v" type="video/mp4; codecs=h264,aac">
</video>
And I'm just importing the reference DASH implementation using
<script src="dash.all.min.js"></script>
I'm generating the HLS and DASH streams using ffmpeg from a high-quality master video exported from Final Cut Pro. The static Webm fallback files are also generated using ffmpeg while the H264 static fallback file is a lower-bitrate export from Final Cut Pro.
Is there a way I can either:
Tell DASH to respect the order of the sources and not jump ahead of the HLS stream
Or, not kick in if video/webm; codecs=vp9,opus is not supported by the browser.
Finally, if neither of those are possible, can I support multiple different codecs simultaneously with DASH? i.e. can I provide both VP9 and H264 DASH streams and have it pick VP9 over H264 where supported and otherwise fall back to H264 (higher bitrate or lower quality)? How would I go about producing that stream data?
From what you have shared, your browser will use the dashjs player when it encounters the video tag with the 'data-dashjs-player' attribute and the DASH player will focus on the formats it supports which do not include HLS.
As a crude solution you could check whether the browser can play HLS and use the native video tag if it can and your DASH player if it does not. Checking for HLS playback is a little undefined but the below approach appears to work at this time:
document.createElement('video').canPlayType('application/vnd.apple.mpegURL')
This should return 'maybe' on a browser which can play HLS (only Safari at this time AFAIK) and nothing if it can't - I just tested it on Safari and Chrome and it seems to behave like this.
Its worth noting that dash.js should be able to play MPEG DASH files on safari so it may be worth looking into the console or logs to try to find why it will not play your DASH video.

Video.Js Problems Viewing Cross Browser

I am completely new to VideoJs and media streaming on web pages, so please forgive me if the answer to this is obvious. I uploaded an MP4, OGV and WEBM file to www.sell2trade.com.au. If you view this page you will see that the video on the RHS works in Firefox, has an unsupported error in IE11 and plays the audio only in Chrome!! I downloaded the VideoJS sample and followed it diligently (I think!!) What on earth am I doing wrong!
Thanks for any help as tearing what little hair I have left out :)
The MP4 you're using doesn't appear to be compatible with Chrome. You can go directly to the mp4 url in chrome and see the same audio-only issue. You should try a different encoder, like Zencoder (paid service that I helped build) or Handbrake.
Also it looks like you swapped out the url for the video.js swf for a different swf that plays your video. That's not gonna work. You need to use the swf that's included with video.js.

.mov could not be played - cloudfront.net

I'm using JW player to play some video files on the web but these specific 3 .mov videos are acting weird though the other 2 .mov files are playing okay. Looking at the console, seems like they're always redirected to cloudfront.net.
I've tried converting .mov to .mp4 since I have another video with this format that works fine but still the video could not be played.
I think it's the videos themselves that's defective but I don't know why since they would play fine on a player but not on the web.
Can anyone share why this is doing so?

MP4 file for video.js - specification

on my web application I use video.js to handle all video MP4 files. I have to specify MP4 file details for my video provider.
I want to handle FF, chrome, IE8/9 and iPad by this format.
Could you define a set of video MP4 file details which ensure that video.js will handle with this format (for example: codec, video/audio format, video format profile)?
I do not know if it will be helpful, but I use mediainfo (http://mediainfo.sourceforge.net/en) to check MP4 file's details.
Including the default code that is provided on the video js website should do enough to support the mp4 file you have (specifically "type='video/mp4'"), however, if you're intending to support Firefox, this won't be enough. FF doesn't support the mp4 file type so you'll need to encode an ogv or a webm. FF provides a plugin that can help here at firefogg.org
Hope this helps.