skip deel mp3

Door Jan R op 03-12-2020 13:38

2.313 views

Hi

ik probeer om een deel van een mp3 in html5 tag audio over te slaan.
Ik heb 4 knoppen welke -60,-10, +10 en +60 seconden skippen of terugkeren in een mp3 bestanden.
Echter zodra de code audio.currentTime = (nu + 10); uitvoert komt er een algemene reset van het mp3-bestand
Iemand een idee hoe het wel gaat?

Jan


function skipseconds(sec) {
    let audio = document.getElementById("audio");
    let nu = audio.currentTime;
    audio.currentTime = (nu + 10);// zonder nu + lukt ook niet
}

Zowel chrome als edge lukt niet.

? Onbekende gebruiker

03-12-2020 19:29

Ik heb dit nog nooit eerder heb geprobeerd, maar afgaande op de code en MDN, zou het zo kunnen zijn dat de HTML ID van getElementById() niet verwijst naar een audio tag, maar naar een audio context?

Het verschil zou kunnen zijn dat de eigenschap currentTime van een tag wel schrijfbaar is, maar die van een audio context niet:
- https://developer.mozilla.org/en-US/docs/Web/HTML/Element/audio
- https://developer.mozilla.org/en-US/docs/Web/API/BaseAudioContext/currentTime

Wat misschien zou kunnen helpen is audio eerst pauzeren met pause(), en dan pas currentTime instellen?
Voorbeeld: https://developer.mozilla.org/en-US/docs/Web/Guide/Audio_and_video_delivery/Cross-browser_audio_basics

Jan R

05-12-2020 18:51 gewijzigd op 05-12-2020 18:54

Bedankt. Ik had dat ook gevonden en geloof het of niet. ik heb dezelfde JS-code gemaakt. Echter het werkte niet :(

Even de beide codes naast elkaar gelegd met een los mp3-tje en beide werken.
Na héél veel opzoeken kwam ik bij een oplossing.
Mijn mp3-bestand is eigenlijk een php bestand welke off-root het juiste bestand zoekt (sabam en andere controle organisatie op legale muziek) Bij mij is het wel legaal maar ik mag dat dus niet verdelen.

Nu blijkt dat er toch een header te weinig in stond.

voor de volledigheid hier volgen alle headers welke ik nu gebruik.


header('Content-type: audio/mpeg, audio/x-mpeg, audio/x-mpeg-3, audio/mpeg3');
header('Content-Disposition: filename=' . urlencode(basename($filename)));
header('X-Pad: avoid browser bug');
header('Cache-Control: public, no-cache, must-revalidate, max-age=0');
header('Pragma: no-cache');  
header('Accept-Ranges: bytes');
header('Content-Length:' . filesize($filename));
header("Content-Transfer-Encoding: binary");
header("Last-Modified: $time");

Welke er eigenlijk echt bij moet heb ik niet getest.

Jan

Reageren

Inloggen om te reageren