我正在为音乐作曲家建立一个网站。他想通过Soundcloud发布他的作品样本,并在他的网站上嵌入一些样本。他有一个高级帐户。
我想让他尽可能轻松(他不是不是极客)。基本上,我想让他只是复制&从浏览器的地址栏粘贴歌曲的URL,让我的应用程序为他做剩下的工作。
实际上相对容易实现 - 我成功地使用了标准版本的播放器。但我找不到以编程方式嵌入播放器的小版本的工作方式。没有提到Soundcloud oEmbed参考中的小玩家,只是将maxheight参数设置为18并不适合我。
问题是,我需要在每个页面上实际生成嵌入,因为主页上嵌入的同一首歌应该使用小型播放器呈现,而在子页面上则应该是完全标准的播放器 - 因此我不能只允许他将来自soundcloud的嵌入代码复制并粘贴到我的应用程序中,因为我要么有一个小的播放器嵌入代码或标准播放器代码可用,而不是两者都有。复制和粘贴同一首歌的两个不同的嵌入代码对于这么简单的事情来说似乎太麻烦了。
另一件事是我无法正确测试这个,因为我自己没有Premium帐户而且我无法访问他的帐户..如果开发人员有办法“模拟”一个方法会很酷用于开发目的的高级帐户......
感谢您的帮助!
丹
答案 0 :(得分:5)
不幸的是,/oembed
目前仅适用于常规小部件(Flash的HTML5)。
但是,您可以自己为其中任何一个构建html。这是一个小小部件嵌入的模板:
<object height="18" width="100%">
<param name="movie" value="https://player.soundcloud.com/player.swf?url=http%3A%2F%2Fapi.soundcloud.com%2Ftracks%2F{trackId}&player_type=tiny{widgetParams}"></param>
<param name="allowscriptaccess" value="always"></param>
<param name="wmode" value="transparent"></param>
<embed wmode="transparent" allowscriptaccess="always" height="18" width="100%" src="https://player.soundcloud.com/player.swf?url=http%3A%2F%2Fapi.soundcloud.com%2Ftracks%2F{trackId}&player_type=tiny{widgetParams}"></embed>
</object>
常规小部件的模板:
<iframe width="100%" height="166" scrolling="no" frameborder="no" src="http://w.soundcloud.com/player/?url=http%3A%2F%2Fapi.soundcloud.com%2Ftracks%2F{trackId}{widgetParams}"></iframe>
您应该将它们放入字符串(没有换行符)并对这些字符串执行变量插值。我不确定您使用的是哪种语言,但大多数语言都内置了这种语言。
对于我大部分时间都在写的JavaScript,你可以使用Douglas Crockford的supplant
function。
变量为trackId
,其值应为正整数widgetParams
,其值应为&color=ff6600&auto_play=false
,即key=value
前缀为&
对{
。在我的示例中,我使用}
和/resolve
作为变量的分隔符进行插值,但当然,它可以是您的语言或模板引擎所需的任何内容。
为了让您的客户能够为您提供跟踪网址,您需要向client_id
端点发出API请求,以便从跟踪网址(固定链接)中检索跟踪ID。您需要注册为开发人员才能{{1}}授权API请求。我在another answer here中已经描述了如何在JavaScript中执行此操作。
如果您不想对API发出请求,您也可以要求您的客户端通过点击“分享”按钮向您提供他们可以从SoundCloud上的任何声音或设置轻松检索到的嵌入代码,然后提取使用正则表达式声音或设置ID。
以下是一个示例,说明如何插入一个小小部件(也使用SoundCloud JS SDK)http://jsbin.com/OLUloX/1/edit