Uncaught (in promise) DOMException

04 ноября 2021, 23:00

Скрипт не воспроизводит аудио. Почему?

function setCookie(c_name, value, exdays) { 
  var exdate = new Date(); 
  exdate.setDate(exdate.getDate() + exdays); 
  var c_value = escape(value) + ((exdays == null) ? "" : "; expires=" + exdate.toUTCString()); 
  document.cookie = c_name + "=" + c_value; 
} 
 
function getCookie(c_name) { 
  var i, x, y, ARRcookies = document.cookie.split(";"); 
  for (i = 0; i < ARRcookies.length; i++) { 
    x = ARRcookies[i].substr(0, ARRcookies[i].indexOf("=")); 
    y = ARRcookies[i].substr(ARRcookies[i].indexOf("=") + 1); 
    x = x.replace(/^\s+|\s+$/g, ""); 
    if (x == c_name) { 
      return unescape(y); 
    } 
  } 
} 
 
var song = document.getElementsByTagName('audio')[0]; 
var played = false; 
var tillPlayed = getCookie('timePlayed'); 
 
function update() { 
  if (!played) { 
    if (tillPlayed) { 
      song.currentTime = tillPlayed; 
      song.play(); 
      played = true; 
    } else { 
      song.play(); 
      played = true; 
    } 
  } else { 
    setCookie('timePlayed', song.currentTime); 
  } 
} 
setInterval(update(), 0.0001);

<audio src="http://bestweb.kl.com.ua/media/75519871_456239030.mp3" preload="none" autoplay="autoplay" loop="true"></audio>

Answer 1

Эта ошибка появляется из-за того, что воспроизведение пытаетесь запустить по ходу загрузки страницы, т. е., без взаимодействия с пользователем. Чтобы такого не было, нужно запускать по нажатию на кнопку, или включить в тег аудио атрибут controls, который показывает изображение плеера и даёт возможность на нём нажать на кнопку воспроизведения. Кроме этого для реализации идеи, чтобы после обновления страницы песня начинала звучать с того же самого момента, что её оборвали, не обязательно запускать плеер и задавать currentTime внутри setInterval(). К тому же, период 0.0001 составляет одну десятую часть микросекунды, (даже не милисекунды) это просто фантастический период, для этой цели достаточно одной десятой секунды. Учитывая это всё, я бы сделал так:

<audio src="http://bestweb.kl.com.ua/media/75519871_456239030.mp3" preload="none" autoplay="autoplay"  loop="true"></audio> 
<button onclick="playsound()"> play </button> 
<script> 
var song = document.getElementsByTagName('audio')[0]; 
function playsound(){ 
	var tillPlayed = localStorage.getItem('timePlayed'); 
	if(tillPlayed)song.currentTime = tillPlayed; 
	song.play(); 
	myinterval = setInterval(function(){localStorage.setItem('timePlayed', song.currentTime)}, 100); 
} 
song.onended = song.onpaused = function(){clearInterval(myinterval)}; 
</script>

Правда, этот пример не на куках, а на localStorage, что-то так мне больше нравится, но можно поменять обратно на куки.