HTML5自定義播放器不與Soundcloud api工作uri

我正在使用一個jQuery插件將簡單的<audio></audio>變成一組不同的元素，而不是由javascript控制，基本上創建了一個自定義的html5播放器。你可以在這裏找到這個插件的博客文章：http://tympanus.net/codrops/2012/12/04/responsive-touch-friendly-audio-player/ 它深入地解釋了這個插件。HTML5自定義播放器不與Soundcloud api工作uri

無論如何，由於某些原因，當我通過Soundcloud API爲播放器生成src=""時，它無法正常工作。基本上我從Soundcloud獲得歌曲URL，並將其作爲src添加到音頻標籤。

的問題是，一旦頁面加載它說：src="unknown"（或東西沿着這些路線）

下面是HTML標記這表明使用的SoundCloud都API和自定義播放器插件。

<!DOCTYPE html> 
<html> 
<head> 


<link rel="stylesheet" href="/reset.css"> 
<link rel="stylesheet" href="/player.css"> 

</head> 
<body> 

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

<!-- Javascript/jQuery --> 

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
<script src="//connect.soundcloud.com/sdk.js"></script> 
<script src="/player.js"></script> <!-- /js/player.js --> 

<script> 
// Soundcloud 
SC.initialize({ 
    client_id: '7a17129ba9cd5fff34f847e3539829b7' 
}); 

SC.get("/tracks/81815566", {}, function(sound){ 
    $("#audio-test").attr("src", sound.uri + "/stream?client_id=7a17129ba9cd5fff34f847e3539829b7"); 
}); 

//Custom Player 
$(function() { $('audio').audioPlayer(); }); 
</script> 

<!-- END Javascript/jQuery --> 

</body> 
</html>

這裏是你可能需要看看播放器完整的功能附加文件：

player.csshttp://pastebin.com/HBUFvUw2
reset.csshttp://pastebin.com/jstmq0dB
player.js（插件）http://pastebin.com/MKrUgRDF

或者從這裏下載整個項目：http://www.filedropper.com/example_1

來源

2013-03-06 Ilja

看來問題是/stream?client_id=...。我擺脫了整個字符串並將sound.uri更改爲sound.stream_url，現在它正在流式傳輸（至少在Safari/FF OSX中）。

參見my fiddle here。如果這不適合你，讓我知道，我們會弄清楚！

編輯：我只是試了一遍，它現在不工作。給我一分鐘來弄明白。

編輯II：保持客戶端ID但改變sound.uri到sound.stream_url似乎已經解決了。看起來sound.uri鏈接會提示音頻播放器無法播放的301重定向，但sound.stream_url直接鏈接到媒體。查看更新的小提琴鏈接。

來源

2013-03-06 14:33:20 CodeMoose

那個/ strem？client_id的東西是在我將它添加到url之前，我在歌曲上收到了一個401禁止的錯誤，所以他們不會播放，我設法修復它的唯一方法是通過添加該部分到網址。我認爲jsfiddle不起作用，因爲Soundcloud sdk不包括在內。此外，它自己（在默認播放器中）工作正常，但是一旦我將jQuery自定義播放器插件應用於音頻元素，它就會說src是不設防/未知的 – Ilja 2013-03-06 14:38:32

是的，這一切都太快了。我不知道如何在沒有它的情況下運行它 - 但我現在提供的代碼應該適用於你。 – CodeMoose 2013-03-06 14:44:46

小提琴中提供的代碼在默認的瀏覽器播放器下工作正常，但是一旦我將插件應用到它，仍然沒有工作，並且說它是「未定義的」，那麼您是否有Dropbox帳戶？我可以將你添加到我的項目文件夾中，這就是我現在主持播放器的地方 – Ilja 2013-03-06 14:52:28

HTML5自定義播放器不與Soundcloud api工作uri

回答

相關問題