5

我目前正在使用 SoundCloud API，并希望在单击按钮时嵌入轨道。

我收到两个错误：

XMLHttpRequest 无法加载http://soundcloud.com/oembed.json?url=http%3A%2F%2Fapi.soundcloud.com%2Ftracks%2F48419073。Access-Control-Allow-Origin 不允许 Origin null。

和

未捕获的类型错误：无法读取 null 的属性“html”

这是我的代码：

<button onclick="getPopular()">+1</button>
<div id="track"></div>

<script src="http://connect.soundcloud.com/sdk.js" type="text/JavaScript"></script>
<script type="text/JavaScript">
    SC.initialize({
        client_id: "**************",
    });

    var getPopular = function() {
        SC.get("/tracks", {limit: 1}, function(tracks) {
            var track = tracks[0];
            alert("Latest track: " + track.title);
            SC.oEmbed(track.uri, document.getElementById("track"));
            });
        };
</script>

我在代码中使用警报让我知道它实际上是从 SoundCloud API 获取信息。我只是不确定还有什么阻止它嵌入。

谢谢，提前，或者看我的问题。

  • 拼图
4

2 回答 2

17

阅读一些关于同源政策的内容，以更好地了解您的主要问题。Ajax、localhost 和 Chrome/Opera 不能很好地结合在一起。这个相关的问题甚至更好。

html您的第二个问题是由于 Ajax 调用（在您的 API 中的某处）由于第一个错误而没有返回响应。

我将提供一个解决方案，而不是解释问题（在上面的链接中对此进行了很好的解释）。由于您在 Chrome 上运行，因此有一种解决方法。使用此选项启动 chrome：

--allow-file-access-from-files

（我无耻地从Pointy借来的解决方法）

您也可以尝试在 Firefox 上运行它，或者暂时托管它。:)

PS 如果您打算从本地机器上进行认真的开发，您可以考虑安装 Apache 来通过 服务和测试内容http://localhost，从而解除file:///限制。

以下是为开发而预先配置的 Apache 和 PHP 附带的一些出色工具：

于 2012-06-02T21:24:05.740 回答
0

如果您要回溯，我会尝试 alert(document.getElementById("track")); 以确保你得到你的 dom 元素。

于 2012-06-02T21:04:43.357 回答