如何使用 Soundcloud api 获取流到 html5 音频播放器？
Posted
技术标签:
【中文标题】如何使用 Soundcloud api 获取流到 html5 音频播放器？【英文标题】：How to use Soundcloud api to get stream into html5 audio player? 【发布时间】：2013-03-04 18:32:26 【问题描述】：我刚开始学习 javascript，作为我的第一次尝试，我想创建自定义音频播放器，它使用 soundcloud 的 api 作为音乐源。
到目前为止，这是我设置的：
<!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>
【问题讨论】：
需要比这更多的工作 - 你能把 javascript 控制代码放在一个 pastebin 中以便我们看一眼吗？ @CodeMoose 添加了它，还添加了我用于此 html5 播放器的博客文章的链接。 【参考方案1】：好的，明白了。问题在于 .stream() - 它旨在提供由 .play() 函数部署的预打包播放器。
如果您改用SC.get()，您将实际访问轨道的属性，并能够将其嵌入到音频标签中。查看我的代码：http://jsfiddle.net/LpzpK/6/
还有一个问题 - 曲目被标记为 401 禁止，因此播放器只会“加载”。您必须找到一种方法来公开您想要播放的曲目。
【讨论】：
感谢您的大力帮助，我想我已经看到了如何处理文档中某处禁止的 401 的一瞥，我会尝试弄清楚 ;) 成功了！只需要将 /stream?client_id=YOUR_ID 附加到 sound.uri ;)) thnx 再次寻求帮助！ @Ilja 你们有解决方案吗 @Lakshay，我们最终并没有使用 spotify api 并手动嵌入 souncloud url 以获取其上不可用的曲目。不过那是不久前的事了，我敢肯定他们的 api 已经发生了很大变化，也许现在这是可能的。【参考方案2】：粗略一看，似乎所有 soundcloud API 对象都带有一个直接链接到资源的 URI 属性。在您的情况下，它将是 sound.uri。
在播放器代码的顶部，您有一个 <audio> 标签 - 我猜您可能希望将它的 src 设置为您正在播放的曲目的 URI 值。您可以通过为其附加一个 ID 并调用
SC.stream("/tracks/293", function(sound)
$("[audio_id]").attr("src", sound.uri);
);
用您为标签选择的任何 ID 替换 [audio_id]。每次播放器更改时，您可能仍然需要做一些事情来重新初始化/重新启动播放器，但这有望让您开始。告诉我它是如何工作的！
【讨论】：
试过了，好像不行。我大大简化了我的播放器以更好地理解一切，但我仍然无法让它工作，这是我的新代码pastebin.com/A76pgjMf 我会把它放在一个小提琴里，然后玩弄它 - 一会儿还给你 我没有让回调函数运行。您是否需要做任何事情来实例化对象（var SC = new soundcloud();) 或其他什么？ 让我检查文档 你能看到那个“声音”功能吗，不确定，但是，当用户点击播放按钮时，它是否应该被调用，所以它把那个 src 放进去？以上是关于如何使用 Soundcloud api 获取流到 html5 音频播放器？的主要内容，如果未能解决你的问题，请参考以下文章
（译）SoundCloud 如何使用 HAProxy 和 Kubernetes 处理用户流量