Come utilizzare Soundcloud api per ottenere lo streaming nel lettore audio html5?

Ho appena iniziato a imparare javascript e come primo tentativo mi piacerebbe creare un lettore audio personalizzato che utilizzi l'api di soundcloud come fonte per la musica.Come utilizzare Soundcloud api per ottenere lo streaming nel lettore audio html5?

Finora questo è ciò che mi sono istituiti:

<!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>

fonte

2013-03-04 Ilja

Hai bisogno di un po 'di più per andare avanti di questo - puoi mettere il codice di controllo javascript in un pastebin in modo che possiamo dare un'occhiata? – CodeMoose

@CodeMoose l'ha aggiunto, ha anche aggiunto il link al post sul blog che sto utilizzando per questo player html5. – Ilja

Perfetto, grazie! – CodeMoose

Ok, ho capito. Il problema era il .stream() - ha lo scopo di fornire un giocatore preconfezionato, distribuito dalla funzione .play().

Se si utilizza SC.get(), invece, si accede effettivamente alle proprietà della traccia e si è in grado di incorporarlo in un tag audio. Vedere il mio codice: http://jsfiddle.net/LpzpK/6/

C'è ancora un problema: le tracce sono contrassegnate come vietate a 401, quindi il giocatore è sempre in "caricamento". Dovrai trovare un modo per rendere pubbliche le tracce che vuoi riprodurre.

fonte

2013-03-04 21:06:49 CodeMoose

Grazie per l'aiuto, penso di aver visto un assaggio di come trattare con 401 proibito da qualche parte nella documentazione, cercherò di capirlo;) – Ilja

ha funzionato! solo bisogno di aggiungere/stream? client_id = YOUR_ID a sound.uri;)) thnx di nuovo per aiuto! – Ilja

Nessun problema: buon divertimento! – CodeMoose

A uno sguardo superficiale, sembra che tutti gli oggetti API SoundCloud sono dotati di una proprietà URI che collega direttamente alla risorsa. Nel tuo caso, sarebbe sound.uri.

Nella parte superiore del codice del lettore, si dispone di un tag <audio>: suppongo che si desideri impostare il valore src sul valore URI per la traccia che si sta riproducendo. È possibile farlo collegando un ID ad esso e chiamando

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

sostituzione [audio_id] con qualsiasi ID che hai scelto per il tag. Probabilmente dovrai ancora fare qualcosa per reinizializzare/riavviare il player ogni volta che cambia, ma si spera che tu possa iniziare. Fammi sapere come funziona!

fonte

2013-03-04 19:48:21 CodeMoose

Provato che non sembra funzionare. Ho semplificato il mio lettore in modo drammatico per capire meglio tutto, ma non riesco ancora a farlo funzionare, ecco il mio nuovo codice http://pastebin.com/A76pgjMf – Ilja

Farò cadere questo in un violino e giocherellare con esso - – CodeMoose

Non riesco a far funzionare la funzione di callback. Devi fare qualcosa per istanziare l'oggetto (var SC = new soundcloud();) o qualcosa del genere? – CodeMoose

Come utilizzare Soundcloud api per ottenere lo streaming nel lettore audio html5?

risposta

Problemi correlati