I've developed an application like netflix which streams video.
I'm working with video.js.
when I try to play unmuted video, it throw error says that
"Uncaught (in promise) DOMException: play() failed because the user didn't interact with the document first. https:// goo.gl/xX8pDD"
I can understand what the policy is, but I wonder how autoplay works in Netflix.
Video Preview on netflix works with sound well on chrome and safari.
as soon as I access the video chat page in Netflix party, it turns to play with sound.
I wanna know what they do and apply them to mine.
Thanks.
It seems some sites are whitelisted:
If you don’t have browsing history, Chrome allows autoplay for over 1,000 sites where we see that the highest percentage of visitors play media with sound.
Related
I am building a PWA with Agora broadcasting API. I managed to get the video stream playing on desktop Chrome, but not on Safari. The documentation says Safari is supported on both MacOS and iOS, but it doesn't seem like the case.
When I opened the client page on Safari, instead of playing the video stream, it just create a video player without content. I don't see any data being streamed in the inspector view, or there isn't any activity going on at all.
Do I need to do something different with Safari?
Agora.io provided an auto-diagnostic page for their Web SDK, which may be useful for you:
agora_webrtc_troubleshooting
I was going back and forth with Spotify Cares Twitter for over four days. Finally they directed me here, so I hope one of the devs from Spotify will answer.
I am trying to put Spotify Play Button on the website. I was following the instructions from the documentation. Then I also found on the Spotify blog, that some details had changed in July 2018. So I have tried this code as well.
Whatever I did, the Play Button embed player plays only preview (30 seconds) when accessing website in the Chrome (version 68 and 69).
The code is simple and straight taken from the documentation/blog:
<iframe src="https://open.spotify.com/embed?uri=spotify:album:1DFixLWuPkv3KT3TnV35m3" width="300" height="380" frameborder="0" allowtransparency="true" allow="encrypted-media"></iframe>
This code I have put into the empty HTML, so completely no other code interfering. You can check it in the example on Codepen.
I have tried to isolate the issue and here's what I have found:
In Chrome it never works: neither when I am logged into Spotify nor when I am not and log in with the button that shows up in the player
In Chrome with/without SSL - in both cases it didn't work
In Firefox it works properly. When I log into Spotify on the browser, go to the page, it plays full tracks
Also asked my friends to go to the page with this code and - being logged into Spotify - it didn't work for them as well
The play button works properly in the examples on blog and documentation of Spotify - which is in their domain, so it is the same domain as the iframe content - this is a hint I think.
I have checked also recent changes in Chrome, but only one concerning iframe was adding allow on microphone and camera. Even using this one didn't help (but this should not be related actually).
I have also checked on recent Safari / MacOS - the issue is there as well (but not on Firefox/MacOS)
What can be the reason for the issue? How to solve this? Or maybe Spotify devs team need to fix it?
So the answer is quite obvious if you know where to look.
Under chrome://settings/content/cookies Google Chrome has this option Block third-party cookies. I had it enabled and that was the cause of the issue.
But why I didn't think of it before? It's because Google Chrome in such case adds to all non-white-listed (see below) sites a cookie icon with red X to the right side of the Address Bar. When one clicks it, it shows two options:
Always allow [url of the site] site to save cookies
Keep blocking the cookies
And since I had the first one selected it looked good to me back then.
But this option is not the same as "allow use of the third-party cookies", which is not available in the popup options window.
In fact to allow sites to use cookies from Spotify, you have to either:
Disable the option Block third-party cookies in the Chrome Settings in general
or add [*.]spotify.com to your white-list (I recommend this one)
And that way, any site can access spotify.com cookies to check if user is logged in to properly play music (full tracks or just previews).
And one final note: the site with the embed play button code must be accessed with SSL, so via https.
I didn't check how to change that for Safari on MacOS, but probably the solution is similar to this one.
I have been trying to get this to work for months but it's still not working. It works fine in all browsers except Google Chrome. The problem is audio doesn't stream in Chrome.
Here's a JS fiddle of the most basic example. https://jsfiddle.net/sq23uxqs/
First I include the new javascript SDK
<script src="https://connect.soundcloud.com/sdk/sdk-3.0.0.js"></script>
Then in my Javascript
SC.initialize({
client_id: "78c2f0ffbef212328769a921e5663879"
});
SC.stream('/tracks/293').then(function(player){
player.play();
});
Does anyone know why this is or is it a problem with the API?
After investigation it seems to be related to issues with the flash player. Proof is that if you go here chrome://plugins/ and disactivate the flash player it will work again in Chrome. But obviously when developing a site you don't want the site to work just for you.
Soundcloud Api seems to use soundmanager2 as a base to handle audio stream that itself have 2 modes flash and html5. The issue is that if the flash player is avaible it will try to use it and fail while if it's not available it will just use html5 and work right away.
https://github.com/soundcloud/soundcloud-javascript/issues/39
'rtmp' protocol on chrome causes that issue.. reverse the order of available protocols so 'http' will be before 'rtmp'
if (player.options.protocols[0] === 'rtmp') {
player.options.protocols = player.options.protocols.reverse();
}
I was looking for a plugin that could play both audio and video files and was happy to come across mediaelement.js. I host all of my audio and video from Dropbox. The audio is playing fine but the video does not, just hangs on the loading screen.
I saw another thread posted here with no response. Below is the shortcode I'm using:
[video src="https://www.dropbox.com/s/udprb5o5p3n6uu8/WCN.mp4" width="242" height="136" poster="http://wellsmartsolutions.com/video/video.png"]
Not other plugins are active that would be causing any conflict. What am I doing wrong?
Try this URL instead: https://dl.dropboxusercontent.com/s/udprb5o5p3n6uu8/WCN.mp4. I've changed the domain to dl.dropboxusercontent.com per https://www.dropbox.com/help/201. This links directly to the video rather than a web page that previews the video.
I'm creating a site that reads a JSON file and using backbone.js creates a one page website that shows 60 lessons (grouped by topic). Each lesson has at least one video. All videos were encoded in MP4 H.264 and OGG. The site was tested last week in FF, IE9, iPad and iPhone, so I know that the videos were encoded correctly.
Some changes to the host were made and now the videos aren't playing correctly. FF works fine, but the browsers using the MP4 are showing different behaviors.
They actually work in IE9 on the page and surfed to directly.
In chrome, they don’t work on the page but I can surf to the video and it will play.
In safari, surfing to the video doesn’t let it play either.
Here's a link to the site. Ignore the certificate warning. The videos are displayed by clicking the red "WATCH" tab.
https://elearning.rcsdk12.org/courses/Algebra1/#topic/1/lesson/1