2012-11-05 11 views
7

następujący kod działa w Chrome (22,0), ale nie w Safari (6.0)Ładowanie dźwięku za pośrednictwem adresu URL Blob nie w Safari

<!DOCTYPE html> 
<html> 
<head> 
<script> 
function onGo(e) { 
    var fr = new FileReader(); 
    var file = document.getElementById("file").files[0]; 
    fr.onload = function(e) { 
     var data = new Uint8Array(e.target.result); 
     var blob = new Blob([data], {type: 'audio/mpeg'}); 
     var audio = document.createElement('audio'); 
     audio.addEventListener('loadeddata', function(e) { 
      audio.play(); 
     }, false); 
     audio.addEventListener('error', function(e) { 
      console.log('error!', e); 
     }, false); 
     audio.src = webkitURL.createObjectURL(blob);  
    }; 
    fr.readAsArrayBuffer(file); 
} 
</script> 
</head> 
<body> 
    <input type="file" id="file" name="file" /> 
    <input type="submit" id="go" onclick="onGo()" value="Go" /> 
</body> 
</html> 

w Safari, ani zwrotna (loadeddata ani błędu) jest tzw. Użyta zawartość to plik mp3, który jest zwykle odtwarzany z tagiem dźwiękowym. Czy Safari wymaga specjalnej troski?

+0

Zobacz http://stackoverflow.com/questions/4201576/html5-audio-files-fail-to-load-in-safari co wydaje się rozwiązać problem – cubitouch

Odpowiedz

0

Czasami dźwięk HTML5 może przestać się ładować bez wyraźnego powodu. Jeśli spojrzysz na wydarzenia związane z multimediami (http://www.w3schools.com/tags/ref_eventattributes.asp), zobaczysz wydarzenie o nazwie: "onStalled", definicją jest "Skrypt uruchamiany, gdy przeglądarka nie może pobrać danych multimedialnych z jakiegokolwiek powodu" i wydaje się, że powinno to być pomocne dla ciebie.

Spróbuj słuchania dla tego wydarzenia i przeładowywania pliku, jeśli to konieczne, z czymś takim:

audio.addEventListener('onstalled', function(e) { 
     audio.load(); 
    }, false); 

Mam nadzieję, że to pomaga!

0

Mam ten sam problem i już spędziłem kilka dni na rozwiązywaniu problemów. Jak pwray wymienione w tym drugim wątku, Safari wymaga rozszerzenia plików dla wniosków mediów:

HTML5 Audio files fail to load in Safari

Starałem się uratować moje blob w pliku, nazwał ją plik.mp3 i Safari udało się załadować audio w ten sposób, ale po zmianie nazwy pliku, który nie ma rozszerzenia (tylko "plik"), nie został załadowany. Kiedy próbowałem url utworzony z kropelka na innej karcie w Safari:

url = webkitURL.createObjectURL(blob); 

go pobrać plik od razu nazwie „nieznane”, ale kiedy próbowałem to samo w Chrome (także na Macu), to pokazał zawartość pliku w przeglądarce (pliki mp3 zaczynają się od ID3, następnie kilka nieczytelnych znaków). nie mogłem dowiedzieć się, jak jeszcze mogę wymusić url wykonany z kropelka mieć rozszerzenie, ponieważ zwykle wygląda to tak:

blob:https://example.com/a7e38943-559c-43ea-b6dd-6820b70ca1e2 

tak do końca to wygląda zmiennej sesji.

To tutaj utknąłem i naprawdę chciałbym zobaczyć rozwiązanie od niektórych inteligentnych ludzi tutaj. Dzięki, Steven

+0

nie udzielić odpowiedzi na pytanie. Gdy masz już wystarczającą [reputację] (https://stackoverflow.com/help/whats-reputation), będziesz mógł [komentować dowolny wpis] (https://stackoverflow.com/help/privileges/comment); zamiast tego [dostarczaj odpowiedzi, które nie wymagają wyjaśnień od pytającego] (https://meta.stackexchange.com/questions/214173/why-do-i-need-50-reputation-to-comment-what-can- i-do-zamiast). - [Z recenzji] (/ review/low-quality-posts/17880680) –

+0

Jasne, ale chciałem najpierw wysłać to jako komentarz, a nie mogłem, dlatego wysłałem to jako odpowiedź, chociaż nie jest to odpowiedź, ale może dostarczyć dodatkowych informacji, które pomogą rozwiązać problem. – Steven

+0

Zrobiłem wiele reasearch na ten temat i wygląda na to, że Safari po prostu nie może odtwarzać dźwięku przesyłanego strumieniowo z obiektu blob, ponieważ Safari szuka rozszerzenia (.mp3), aby zidentyfikować źródło, w przeciwnym razie wyświetla komunikat "Błąd" w element audio.Po przekonwertowaniu obiektu blob na adres URL z tą linią: 'audio.src = webkitURL.createObjectURL (blob);' plik audio.src będzie wyglądał następująco: 'blob: https: //example.com/a7e38943-559c -43ea-b6dd-6820b70ca1e2' i nie ma rozszerzenia – Steven

Powiązane problemy