I had an simple Player on my Website where a Soundcloud Track can be played. I'm using the Widget API. Everything was working fine the last weeks, but now i get this Error in Chrome Browser (Desktop): The AudioContext was not allowed to start. It must be resumed (or created) after a user gesture on the page.
I just simplified the code for you:
<!-- Own Play Button -->
<div id="playBtn">Play</div>
<!-- SC Widget -->
<iframe id="sc-widget" src="https://w.soundcloud.com/player/?url=http://api.soundcloud.com/tracks/406078437" scrolling="no" frameborder="no"></iframe>
<!-- JS -->
<script src="/src/vendors/jquery-3.3.1/jquery.min.js"></script>
<script src="/src/vendors/sc-widget-api/sc-widget-api.js"></script>
<script>
$(document).ready(function()
{
var widgetIframe = document.getElementById('sc-widget');
var widget = SC.Widget(widgetIframe);
widget.bind(SC.Widget.Events.READY, function()
{
});
$('#playBtn').on('click', function()
{
widget.play();
})
});
</script>
When I use the Soundcloud widget Button itself, I get this Error message too, but it plays the song.
When I use my own Playbutton I get this Error message and the song does not play. Was working the last days.
I think Chrome changed something, but I'm not sure how to get this to work now? I hope you can help me <3