I have created a WordPress plugin that records reviews in video format with VideoJS (JS library). I am using Video.JS 7.14.3 with Video.JS-Record 4.5.0 and RecordRTC 5.6.2.
I am facing an error on the Safari browser, as seen in the image below:
When I click on the video to record it throws an error.
The videos that I previously recorded in a different browser do not play on Safari. The same issue happens anytime I try to play the recorded video.
Related
I'm maintaining a legacy ASP/VBScript application for some warehouse scanners. They run Android 7 with Chrome 64. I can configure Chrome however I want so I'm not constrained like a normal website would be. Due to the nature of this web application, playing a sound on page load would improve usability (when the submitted action fails). Is there any way to allow an audio file to play on page load?
I can play sounds easily after a user interaction. However, I've tried multiple methods to play a sound on page load without success:
An <audio> tag with autoplay does not play (<audio autoplay="">).
Play the sound during the load event (Audio.play()). The returned Promise fails with the error:
NotAllowedError: play() can only be initiated by a user gesture.
Create an Audio with autoplay, and append it to body during the load event.
Create an Audio, append it to body, and .play() it during the load event. Yields the same "NotAllowedError".
Whitelisting the website for sounds in Chrome.
Ensuring the media autoplay setting is set to allowed in Chrome.
Both Chrome and Firefox, have dropped support for the autoplay attribute for both audio and video unless it's a video with the sound muted.
You can read more on that here: Autoplay Policy
However, recently I found a workaround using the Howler.js library, and it seems to work quite well in just these lines of code:
let timer, sound;
sound = new Howl({
src: ['<?= get_theme_file_uri() ?>/images/spotAudio.mp3']
});
sound.play();
You can download the library and read the docs here: https://howlerjs.com/
The site I am working on is using some code from its previous website from a few years ago. The audio player doesn't load in firefox (click the listen button, audio player will open in popup). I think it's using jw player.
It's fine in Chrome but in Firefox it just doesn't appear. Any idea why?
That site use jwplayer 5 (very old), so the player needs Flash player correctly activated on Firefox (https://helpx.adobe.com/it/flash-player/kb/enabling-flash-player-firefox.html)
On Chrome, maybe you have the flash player blocked (by default with new Chrome versions) and the player fallback to mp3 file, or the flash plugin is correctly activated on Firefox
I'm struggling with playing youtube video after a countdown from javascript. It is working in chrome but not in chrome on android devices.
The error is: "API can only be initiated by a user gesture".
The same problem arises with an html5 video, but in this case I was able to solve the issue thanks to andreybavt answer to this question.
I've got a quick n dirty trial here,
<body>
TEST
<audio src="preview1.mp3" id="audio"></audio>
</body>
Then in my javascript console on desktop, I do the following:
var audio = document.getElementById('audio');
audio.play(); // the first audio plays just fine!
audio.pause();
audio.src = 'preview2.mp3';
audio.play(); // the second audio plays fine, too!
However, when I do the exact same thing on any mobile device (specifically iOS and Android devices are the ones that I've tried), absolutely nothing happens. No audio plays at all.
I've done a ton of searching online but it doesn't seem to be the case for anybody else?
Thoughts?
If you are having trouble with your audio player, please note that in Safari on iOS (for all devices, including iPad), where the user may be on a cellular network and be charged per data unit, preload and autoplay are disabled by the iOS. No data is loaded until the user initiates it. This means that the audio player is inactive until the user initiates playback by clicking on the play button.
For Android devices:
Chrome does not allow applications to play HTML5 audio without an explicit action by the user, similar to how it is handled by iOS, but differently than how the stock Android browser handles it.
Reference: http://www.wix.com/support/html5/technical-difficulties/browser-compatibility/faq/my-video-is-not-playing-on-my
I've been using the video.js plugin and Vimeo for over a year now, its all worked perfectly by using the direct MP4 link provided from Vimeo Pro account. It's now stopped working in chrome, it looks to be the player isn't working with HTML5. The player still works in firefox, IE and safari as it defaults to the flash player.
Developer tools isn't throwing any errors.
How do I get it to work again in chrome?
You can user latest version of videojs and css file also add data-setup attribute in video tag