We Keep Coding

JS currentTime of video HTMLelement doesn't work

I have the problem in redmine. Video attachments absolutly cannot be seeking. I deleted all js scripts working on videos and tried to change 'currentTime'. It doesn't work. I checked it with different video files, changed webm/mp4, tried to use 'video-js'. Video still cannot be seeking.
Simplisticaly this code do nothing
media = document.querySelector('video')
console.log(media.duration) // 119.03
media.currentTime = 10 // do nothing
The event 'seeking' works only at the beggining.

Normally, code above should work.
Have your tried on different browsers.
const media = document.querySelector('video');
media.currentTime = 5;
<video src="https://glpjt.s3.amazonaws.com/so/av/vid5.mp4" width='240' controls></video>

I decide my trouble for rails. Its need to add for video file requests:
headers['Accept-Ranges'] = 'bytes'
Good luck, guys!

AMR audio not playing in browser, html generated via javascript

Via javascript, I am trying to create the HTML and play an audio file but it's not playing.
If I download that same file and play it via a media player, it plays. My attempt is as below.
var audio = document.createElement("audio");
audio.src = "/files/chat-space/4928f76ff3258fcca32bb75d5d043237";
audio.play();
Is there any way to play this audio inside the browser, even using some other js-supported media player?

Writing the error you're receiving by #ZeroWorks comment would make it much easier, and without an actual example I can only answer it as a guess.
I assume the error you're getting is "play() failed because the user didn't interact with the document first."
I don't know what you're trying to do, but one solution for that could be 'forcing' the client to interact with the document using a button element.
For example:
<script>
function onClick() {
var audio = document.createElement("audio");
audio.src = "./mediaFile.mp3";
audio.play();
}
</script>
Then have the following button element:
<button onclick="onClick()"> Click me </button>
If this is not your issue please try to explain it more precisely.

You can use Audio class in JS
var audio = new Audio('audio_file.mp3'); // file must be having mp3 format
audio.play();

Try:
<script type="text/javascript">
window.addEventListener('load', () => {
var audio = document.createElement("audio");
var asrc = document.createElement("source");
asrc.setAttribute('src', "/files/chat-space/4928f76ff3258fcca32bb75d5d043237");
audio.appendChild(asrc);
audio.play();
});
</script>
Notes:
The window.addEventListener('load') tells the page not to try playing the audio until all HTML and resources are loaded/available.
The audio tag does not have a src= attribute — it has a child element, <source>, and that element has the src= attribute.
FWIW, I just tested the above code on a live server, using a standard mp3 audio file. If this code does not work for you, first try it with a standard .mp3 file (to ensure the problem is not with specifying the audio file).
If it still doesn't work, please tell us more about your environment.
See:
https://www.w3schools.com/TAGS/tag_audio.asp

Load different video in HTML5 video player

I have an HTML5 video tag that I dynamically load. Here's my HTML:
<video id="video" width="640" height="480" controls autoplay>
<source id="source" src="" type="video/mp4">
</video>
Here is my JavaScript for loading the video:
function RunVideo(index) {
var grid = document.getElementById("ctl00_ContentPlaceHolder1_gvPresentations");
var cell = grid.rows[(+index) + 1].cells[2].innerHTML;
var player = document.getElementById('video');
var mp4Vid = document.getElementById('source');
var movie = cell;
player.pause();
mp4Vid.setAttribute('src', movie);
player.load();
player.play();
}
The first time I load a video (from a grid view) it works fine. But any subsequent ones I try to load I get the following message in the video player:
Error: Unsupported video type or invalid file path.
How can I correctly unload the current video in order to reload a new one?
Edit
It seems to be an IE only bug. It does work in other browsers like a charm.
It is able to play each video individually on load (i.e if no other src have been set before).
The links and code are ok then.
It throws a MEDIA12899: AUDIO/VIDEO: Unknown MIME type. error.

Edit:
After I tested with this fiddle, the bug doesn't raise, so my assumptions were incorrect.
Which leaves you with the only choice of trying to re-encode your videos.
Original answer:
It seems you are facing an IE bug, when setting the source element with different codecs(not type).
I think that the browser automatically assigns for himself the codec parameter, in the type attribute and doesn't update it when the new src is set.
Even if all your videos are encapsulated in .mp4, the codecs may vary.
You can find a list of codecs that IE does support here. Basically, .webm, '
H.264 high profile' and H.264 baseline profile.
One possible workaround you may try, if my assumptions are correct, is to create a new sourceelement each time you call your RunVideo function.
function RunVideo(index) {
var grid = document.getElementById("ctl00_ContentPlaceHolder1_gvPresentations");
var cell = grid.rows[(+index) + 1].cells[2].innerHTML;
var player = document.getElementById('video');
var oldMp4Vid = document.getElementById('source');
var movie = cell;
var newmp4Vid = document.createElement('source')
newMp4Vid.src = cell;
player.removeChild(oldMp4Vid);
player.appendChild(newMp4Vid);
player.load();
}
I'm not sure it will do the trick and I'm not sure what the specs tells about setting <source> new src on the flow like that, but if this problem is only present in IE, it's probably a bug from them, maybe you could fill a bug report.
Alternatively, you could re-encode your videos with the exact same codec.

Why does audio not start when 'play' button is first clicked?

I'm having trouble with audio in Firefox. I have an .ogg audio clip in an <audio> tag, and Firefox does not start playing the file when the play button is fisrt pressed. However, if the play button is pressed and then a time is selected from the timeline, the audio will start playing from the time selected. The file will also start playing if the play button is pressed repeatedly (e.g. play/pause/play).
I'm also using the web audio API to run the audio through an AnalyserNode. The issue, however, does not seem to relate to the analyser specifically, as this can be removed without affecting this issue. It seems to have something to do with createMediaElementSource. If I remove the JavaScript code related to this, the issue disappears.
The audio file is being served from the same origin, so I'm fairly certain this is not a CORS issue (as described here). As I said, the audio will play, but only if a time is selected on the timeline.
I'm including the simplest example of the issue below. This would likely need to be run from an HTTP server (python -m http.server, python -m SimpleHTTPServer or whatever) in order to avoid any CORS issues. For this reason, I don't think I can include a JSFiddle demonstration of this issue here.
This issue appears to be Firefox only. It definitely does not affect Chrome, but I haven't actually tested any other browsers yet.
<audio id="audio" controls>
<source src="piano-sonata-no13.ogg" type="audio/ogg" />
</audio>
<script>
var audio_node = document.getElementById('audio');
var audioctx = new (window.AudioContext || window.webkitAudioContext)();
var analyser = audioctx.createAnalyser();
window.addEventListener('load', function(e) {
var source = audioctx.createMediaElementSource(audio_node);
source.connect(analyser);
source.connect(audioctx.destination);
}, false);
</script>
Edit: An example of this issue can be found here: http://mdn.github.io/media-source-buffer/

Try replacing the window "load" event listener with this:
audio_node.addEventListener('canplay', function(e) {
var source = audioctx.createMediaElementSource(audio_node);
source.connect(analyser);
source.connect(audioctx.destination);
}, false);

This issue appears to be related to a Firefox bug.
The gist of it is, it appears as if createMediaElementSource is currently somewhat broken in Firefox, and you can't use the audio API with createMediaStreamSource and have it work as expected.
I found a workaround here (WARNING: page autoplays audio), but as far as I can tell, it only works when autoplay is set to true. Quick testing suggests that setting audio.autoplay to true, and immediately calling audio.pause() may be an acceptable workaround to this issue. One downside to this method is that when the play button is pressed, the audio does not start at the very beginning of the file.
This solution would look something like this:
<audio id="audio" controls>
<source src="piano-sonata-no13.ogg" type="audio/ogg" />
</audio>
<script>
var audio_node = document.getElementById('audio');
audio_node.autoplay = true;
// Alternatively, the autoplay attribute can be set on the <audio> tag
var audioctx = new (window.AudioContext || window.webkitAudioContext)();
var analyser = audioctx.createAnalyser();
window.addEventListener('load', function(e) {
var source = audioctx.createMediaElementSource(audio_node);
source.connect(analyser);
source.connect(audioctx.destination);
audio_node.pause();
}, false);
</script>

safari browser doesn’t support HTML5 audio tag in ipad/iphone,Android

I am working on a project based on jquery animation its animation works fine on desktop (Firefox,chrome,opera,IE) also support HTML 5 audio tag but in Ipad/iphone/ Android safari audio tag doesn’t support.Its works fine on Ipad/iphone/ Android firefox.i have searched it in many forum don’t get desire Result. I have used this function :
function playmusic(file1,file2)
{
document.getElementById('music11').innerHTML='<audio id="music1"><source src="'+file1+'" type="audio/ogg"><source src="'+file2+'" type="audio/mpeg"></audio>';
$("#music1").get(0).play();
}
I have called function like : playmusic(2.ogg','2.mp3');
If I give autoplay in audio tag it works but play method not working and I have to use play method as in my application needs sound in particular event see the link
http://solutions.hariomtech.com/jarmies/
I have also changed my function and give direct audio tag in div and call function the same problem I face as I mentioned above. I need sound play in background without any click.if I use auto play method so it play sound only one time but I need sound multiple time on event.

Try to add an autoplay attribute on the audio tag:
function playmusic(file1, file2) {
document.getElementById('music11').innerHTML='<audio autoplay id="music1"><source src="'+file1+'" type="audio/ogg"><source src="'+file2+'" type="audio/mpeg"></audio>';
}
I would however recommend building a proper element and insert that into the DOM - something like this:
function playmusic(file1, file2) {
var audio = document.createElement('audio');
audio.preload = 'auto';
audio.autoplay = true;
if (audio.canPlayType('audio/ogg')) {
audio.src = file1;
}
else if (audio.canPlayType('audio/mpg')) {
audio.src = file2;
}
document.getElementById('music11').appendChild(audio);
}