如何通过soundcloud.com网址获取Soundcloud嵌入代码

I have been researching for hours with no luck to get it worked. Basically I have a cms in which users can put soundcloud url like this "https://soundcloud.com/cade-turner/cade-turner-symphony-of-light", then the page can show an embedded iframe. I have red the api docs for a while but couldn't find anything relavant. This post here have talked but i just didn't quite understand the answers and I checked oEmbed and oEmbed reference but couldn't find proper example. Any one has any more hints?

我一直在研究几个小时没有运气才能让它奏效。基本上我有一个cms，用户可以在其中放置soundcloud url，如“https://soundcloud.com/cade-turner/cade-turner-symphony-of-light”，然后该页面可以显示嵌入式iframe。我已经有一段时间了，但是找不到任何相关内容。这篇文章已经谈过，但我只是不太明白答案，我检查了oEmbed和oEmbed参考但是找不到合适的例子。还有人提示吗？

Edit: Thanks to Jacob's answer, I finally managed to do it by using ajax.

编辑：感谢雅各布的回答，我终于设法通过使用ajax来实现。

var trackUrl = 'THE_URL';
var Client_ID = 'CLIENT_ID';//you have to register in soundcound developer first in order to get this id 
$.get(//make an ajax request
    'http://api.soundcloud.com/resolve.json?url=' + trackUrl + '&client_id=' + Client_ID, 
    function (result) {//returns json, we only need id in this case
        $(".videowrapper, .exhibitions-image, iframe").replaceWith('<iframe width="100%" height="100%" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/' + result.id +'&amp;color=ff6600&amp;auto_play=false&amp;show_artwork=true"></iframe>');//the iframe is copied from soundcloud embed codes
    }
);

4 个解决方案

#1

For the track you selected, the embed code is such:

对于您选择的曲目，嵌入代码如下：

<iframe width="100%" height="166" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/101276036&amp;color=ff6600&amp;auto_play=false&amp;show_artwork=true"></iframe>

The only thing unique to it is the Track ID, in this case it's 101276036.

它唯一独有的是Track ID，在这种情况下它是101276036。

So your real issue is trying to find the Track ID when you only have the URL, and the Soundcloud API provides a method called resolve to do just that.

因此，当您只有URL时，您的真正问题是尝试查找Track ID，并且Soundcloud API提供了一个名为resolve的方法来执行此操作。

require_once 'Services/Soundcloud.php';
$client = new Services_Soundcloud('YOUR_CLIENT_ID');
$track_url = 'https://soundcloud.com/cade-turner/cade-turner-symphony-of-light'; // Track URL
$track = json_decode($client->get('resolve', array('url' => $track_url)));
$track->id; // 101276036 (the Track ID)

You can then store this ID, or generate and store the HTML that you want to be displayed.

然后，您可以存储此ID，或生成并存储要显示的HTML。

#2

I found this in my codesnippets for exactly your purpose, even withouth having to register a client ID.

我在我的代码片段中找到了这个用于您的目的，即使不必注册客户端ID。

//Get the SoundCloud URL
$url="https://soundcloud.com/epitaph-records/this-wild-life-history";
//Get the JSON data of song details with embed code from SoundCloud oEmbed
$getValues=file_get_contents('http://soundcloud.com/oembed?format=js&url='.$url.'&iframe=true');
//Clean the Json to decode
$decodeiFrame=substr($getValues, 1, -2);
//json decode to convert it as an array
$jsonObj = json_decode($decodeiFrame);

//Change the height of the embed player if you want else uncomment below line
// echo $jsonObj->html;
//Print the embed player to the page
echo str_replace('height="400"', 'height="140"', $jsonObj->html);

#3

I was looking for something similar and found this really helpfull:

我正在寻找类似的东西，发现这真的很有帮助：

https://developers.soundcloud.com/docs/oembed#introduction

Just try this CURL command:

试试这个CURL命令：

curl "http://soundcloud.com/oembed" -d 'format=json' -d 'url=http://soundcloud.com/forss/flickermood'

Or this jQuery ajax request:

或者这个jQuery ajax请求：

var settings = {
  "async": true,
  "crossDomain": true,
  "url": "http://soundcloud.com/oembed",
  "method": "POST",
  "headers": {},
  "data": {
    "format": "json",
    "url": "http://soundcloud.com/forss/flickermood"
  }
}

$.ajax(settings).done(function (response) {
  console.log(response);
});

#4

This is a jQuery-based Javascript solution which I wrote.

这是我写的基于jQuery的Javascript解决方案。

It doesn't require a Client ID.

它不需要客户端ID。

Make sure jQuery is included, and add this to the <head> of your document:

确保包含jQuery，并将其添加到文档的：

<script type="text/javascript">
document.addEventListener("DOMContentLoaded", function(event) {
    (function ($) {
        $.fn.scembed = function(){
        var datasource  = 'http://soundcloud.com/oembed';
        return this.each(function () {
            var container = $(this);
            var mediasource = $(container).attr("sc_url");
            var params = 'url=' + mediasource + '&format=json&iframe=true&maxwidth=480&maxheight=120&auto_play=false&show_comments=false';
            $.ajaxopts = $.extend($.ajaxopts, {
                                url: datasource,
                                data: params,
                                dataType: 'json',
                                success: function (data, status, raw) {
                                    $(container).html(data.html);
                                },
                                error: function (data, e1, e2) {
                                    $(container).html("Can't retrieve player for " + mediasource);
                                },
                            });
            $.ajax($.ajaxopts);
            });
        };
    })(jQuery);

    $(function(){
        $("div.sc-embed").scembed();
    });
});
</script>

To insert a Soundcloud player into a page create a <div>, assign it a class of sc-embed, and give it an attribute named sc_url, which should be set to the URL of the Soundcloud page.

要将Soundcloud播放器插入页面，请创建一个

，为其指定一个sc-embed类，并为其指定一个名为sc_url的属性，该属性应设置为Soundcloud页面的URL。

For example:

例如：

<div class="sc-embed" sc_url="http://soundcloud.com/forss/flickermood"></div>

To insert multiple players use multiple <div>s with different values for sc_url.

要插入多个玩家，请使用具有不同sc_url值的多个

。

You can alter the params variable in the Javascript to enable or disable player options as listed here: https://developers.soundcloud.com/docs/oembed#introduction

您可以在Javascript中更改params变量以启用或禁用此处列出的播放器选项：https：//developers.soundcloud.com/docs/oembed#introduction

#1