I am using video.js npm library for my next.js project. My video.js component is given below and it will be having the videos in m3u8 formats.
on my localhost, it sometimes shows the video, sometimes doesn't show. It loads at first the control bar and big play btn is displayed, but then in a second, it disappears and gives the error as
The media could not be loaded, either because the server or network failed or because the format is not supported.
I am using the latest version already for video.js which has VHS support and HLS support. version is "^7.18.1"
return (
<div data-vjs-player>
<video
id={id}
ref={videoRef}
className="video-js vjs-default-skin vjs-big-play-centered"
poster={poster}
autoPlay={false}
>
<source src={src} type="video/mp4" />
<source src={src} type="application/x-mpegURL" />
<source src={src} type="video/webm" />
<p className="vjs-no-js">
To view this video please enable JavaScript, and consider upgrading to a web browser that
{' '}
supports HTML5 video.
</p>
</video>
</div>
);
The problem was with back-end. back-end needs to add CORS settings to make it work.
Related
I would like to integrate a video youtube but it doesn't work. The video is there but doesn't play automatically on my website, what could be the reasons?
Thanks!
YouTube stopped autoplay support with their embed API - this may be the reason you are dissatisfied.
Youtube no longer supports autoplay:
Go to youtube to mp4 and convert your video to mp4:
https://www.onlinevideoconverter.com/youtube-converter
Then add this html code to your website:
<video controls autoplay muted>
<source src="YourVideoNameHere.mp4" type="video/mp4">
</video>
I'm currently facing an issue with AMP-audio.
When i open the page that has an mp3 file it works for the first 5 mints and then it go to the end of the mp3 file directly.
i'm wondering, is there any thing that i can do to prevent that, or this is a network issue?
my code is like this
<amp-audio width="auto"
height="50"
src="1.mp3"
preload="auto"
autoplay
controlsList="nodownload">
<div fallback>
<p>Your browser doesn’t support HTML5 audio</p>
</div>
</amp-audio>
Thanks in advance .
The full screen button does not works.
My sources are youtube videos and i use HTML5 and mediaelement 2.13.2
exemple :
<video width="650" height="360" id="player1" preload="none">
<source type="video/youtube" src="http://www.youtube.com/watch?v=ID" />
</video>
Then i allow the fullscreen like this :
<script type="text/javascript">
jQuery('video').mediaelementplayer({
allowfullscreen: 'true'
});
</script>
I'm using a drupal module to implement mediaelement js file in the web site video humour
The module give me an exemple and here, the fullscreen works.
Can you help me ?
thank's
I've got a my own website and I've put on my website a radio interview (MP3 file). On my website there is a tool which takes the MP3 file and plays it.
My file URL is "http://www.abc.com/invterview/July 9 interview.MP3"
Now, another website wants to play the same file and asks me to give te embed/share link.
Can someone help me how to accomplish this link?
I googled and found this webpage http://www.labnol.org/internet/design/html-embed-mp3-songs-podcasts-music-in-blogs-websites/2232/ ,which explains how to accomplish an EMBED, but I've never done this and I know Chrome, IE, FF, Safari have it's own instructions...
So can someone guide me how to accomplish an EMBED URL so it will work on all Browser?
Do I need to use or what is the common use??????
if it was video file I could upload it to Youtube and send that link, but this is a MP3 file.
thanks
You could use HTML5, which has native support for playing audio.
<audio controls="controls" height="100" width="100">
<source src="song.mp3" type="audio/mp3" />
<source src="song.ogg" type="audio/ogg" />
<embed height="100" width="100" src="song.mp3" />
</audio>
If a browser does not support HTML5, the code above will fallback to the embed code.
Other than that, you could use the yahoo media player. It's not the coolest or best around, but it's simple and it gets the job done.
Play Song
<script type="text/javascript" src="http://mediaplayer.yahoo.com/js">
</script>
I have a video, and I need to play it in my ASP.NET page's home page, it should play in a customized small area whenever that home page gets loaded. Can anyone help me?
If it's HTML5 convert it to ogg,mp4,WebM and then upload it to your server then it would be easier and you can do it this way:
<video width="320" height="240" controls="controls">
<source src="yourmovie.mp4" type="video/mp4" />
<source src="yourmovie.ogg" type="video/ogg" />
Your browser does not support the video tag.
</video>
EDIT:
Actually there are tons of samples on the web. Here are some of them.
http://www.aspnet-video.com/aspnetvideo_Demonstration-PlayList-Presentation.aspx
http://www.c-sharpcorner.com/UploadFile/scottlysle/CsharpWebVideo04212007133218PM/CsharpWebVideo.aspx
http://videoplayer.codeplex.com/