Воспроизведение музыки на сайте с прерванного места
 

Здравствуйте.

Возможно ли выполнить следующую задачу?

При заходе на страницу example.html начинает играть мелодия, но если страницу обновить мелодия начинает играть с самого начала, возможно ли сделать, чтобы после обновления страницы мелодия начинала звучать с прерванного места?

Да, надо запомнить время, и при загрузке восстановить его! Этот способ требует добавления уникального id ко всем аудио...

<audio id="my-audio" src="audio.mp3" controls autoplay></audio>
<script>
	addEventListener("beforeunload", function(event) {
		localStorage.audioLastTimes = JSON.stringify(Array.from(document.querySelectorAll("audio[id]"))
		.reduce(function(data, audio) {
			data[audio.id] = audio.currentTime % audio.duration;

			return data;
		}, {}));
	});

	if("audioLastTimes" in localStorage) {
		Object.entries(JSON.parse(localStorage.audioLastTimes)).forEach(function(pair) {
			var audio = document.getElementById(pair[0]);
			if(!audio) return;
			audio.currentTime = pair[1];
		});
	}
</script>

Lefseq,
не самый рациональный, но возможный вариант.

let audio = document.querySelector("audio");
let currentTime = Number(localStorage.audioTime||0);
audio.currentTime = currentTime;
let loop = ()=> {
localStorage.audioTime = audio.currentTime;
requestAnimationFrame(loop);
}
requestAnimationFrame(loop)
//audio.play()

Malleys,
Мне нужно чтобы без плеера на странице, просто фоновая музыка

рони,
А где тут ссылку на песню прописать? Только мне нужно чтобы музыка звучала без наличия плеера на странице, просто фоном. Подскажите пожалуйста.

как создать автовоспроизведение не знаю.

Так удалите атрибут controls

Если у вас предполагается проигрывание всё время одного файла, то можно и так...

<script>

(function() {
	var audio = new Audio();
	audio.src = "audio.mp3";
	audio.currentTime = "audioLastTime" in localStorage ? localStorage.audioLastTime : 0;
	audio.loop = true;
	audio.play();

	addEventListener("beforeunload", function(event) {
		localStorage.audioLastTime = audio.currentTime % audio.duration;
	});
})();

</script>

Это вообще бессмысленно, оно ничего не рисует (и тем более, если переключиться на другую вкладку, то requestAnimationFrame не будет вызываться!)

Malleys,
как заставить работать этот параметр autoplay или audio.play()?
браузеры против.

В спецификации HTML5 написано, что когда у аудио-элемента представлен атрибут autoplay, то браузер автоматически начнёт проигрывание аудио-ресурса с того момента, как только он сможет проигрывать без прерывании.

В новых версиях Google Chrome запуск программного проигрывания возможно только в том случае, если пользователь уже взаимодействовал со страницей. Это было сделано с целью предотвратить шумные вкладки.

Если запустить Google Chrome c аргументом --autoplay-policy=no-user-gesture-required, то оно работает так, как описано в спецификации

спасибо за вариант, но
Firefox тоже не хочет воспроизводить, для клиента добавлять аргументы на запуск, наверно не выход.