Jak korzystać z aplikacji Soundcloud w celu uzyskania strumienia do odtwarzacza audio html5?

Właśnie rozpocząłem naukę javascript i jako moją pierwszą próbę chciałbym stworzyć niestandardowy odtwarzacz audio, który wykorzystuje api soundcloud jako źródło muzyki.Jak korzystać z aplikacji Soundcloud w celu uzyskania strumienia do odtwarzacza audio html5?

Jak dotąd jest to, co mam założyć:

<!DOCTYPE html> 
<html> 
<head> 



<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
<script src="http://connect.soundcloud.com/sdk.js"></script> 

<script> 
window.onload = function() { 
SC.initialize({ 
    client_id: '10e27db0dacd00954d7160b4c092a6e2' //Demo ID 
}); 

SC.stream("/tracks/75868018", function(sound){ 
    $("audio-test").attr("src", sound.uri); 
}); 
}; 
</script> 



</head> 
<body> 

<audio id="audio-test" controls></audio> 

</body> 
</html>

Źródło

2013-03-04 Ilja

Potrzebujesz więcej, żeby przejść dalej - czy możesz umieścić kod kontrolny javascript w pastebin, żebyśmy mogli rzucić okiem? – CodeMoose

Dodano @CodeMoose, dodano także link do postu na blogu, którego używam dla tego odtwarzacza html5. – Ilja

Idealne, dzięki! – CodeMoose

Ok, rozumiem. Problem polegał na .stream() - ma to na celu dostarczenie paczkowanego odtwarzacza, wdrożonego przez funkcję .play().

Jeśli zamiast tego użyjesz SC.get(), uzyskasz dostęp do właściwości ścieżki i będziesz mógł umieścić ją w tagu dźwiękowym. Zobacz mój kod: http://jsfiddle.net/LpzpK/6/

Nadal występuje problem - ścieżki są oznaczone jako 401 zabronione, więc odtwarzacz jest tylko "Ładowanie". Musisz znaleźć sposób na upublicznienie utworów, które chcesz odtwarzać.

Źródło

2013-03-04 21:06:49 CodeMoose

Dziękuję za wspaniałą pomoc, myślę, że widziałem rzut oka na to, jak sobie poradzić z 401 zabronionym gdzieś w dokumentacji, spróbuję to rozgryźć;) – Ilja

działa! wystarczy dodać/stream? client_id = YOUR_ID do sound.uri;)) thnx ponownie o pomoc! – Ilja

Bez problemu - ciesz się! – CodeMoose

Przy pobieżnym spojrzeniem, wygląda jak wszystkie SoundCloud API obiekty pochodzą z własności URI, który łączy się bezpośrednio do danego zasobu. W twoim przypadku będzie to sound.uri.

U góry kodu odtwarzacza znajduje się znacznik <audio> - domyślam się, że warto ustawić jego wartość na src na wartość URI dla odtwarzanej ścieżki. Można to zrobić poprzez dołączenie do niego identyfikator i nazywając

SC.stream("/tracks/293", function(sound){ 
    $("[audio_id]").attr("src", sound.uri); 
});

zastępując [audio_id] ze cokolwiek ID wybrać dla tagu. Prawdopodobnie będziesz musiał jeszcze coś zrobić, aby ponownie zainicjować/zrestartować odtwarzacz za każdym razem, gdy ulegnie zmianie, ale to na pewno Ci się uda. Daj mi znać, jak to działa!

Źródło

2013-03-04 19:48:21 CodeMoose

Próbowałem, że to nie działa. Uproszczę mój odtwarzacz dramatycznie, aby lepiej zrozumieć wszystko, ale nadal nie mogę go uruchomić, oto mój nowy kod http://pastebin.com/A76pgjMf – Ilja

Wrzucę to do skrzypiec i bawię się nim - wracam do ciebie w nieco – CodeMoose

Nie otrzymuję funkcji oddzwaniania do uruchomienia. Czy musisz zrobić cokolwiek, aby utworzyć instancję obiektu (var SC = new soundcloud();) lub coś w tym stylu? – CodeMoose

Jak korzystać z aplikacji Soundcloud w celu uzyskania strumienia do odtwarzacza audio html5?

Odpowiedz

Powiązane problemy