Question

我正在尝试设置位于此处的SC html 5 api：

http://w.soundcloud.com/player/api.js

然而，它在Firebug中引发了“c is undefined”错误（7次）。

经过一番挖掘之后，如果我像这样异步加载Facebook JS，这些错误似乎只会出现：

(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/en_US/all.js#xfbml=1&appId=137624476258287";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));

api.js和facebook.js似乎都在使用函数包装器，但FB导致soundcloud错误输出。

我在下面添加了我的解决方案，此错误可能不仅针对Facebook，而且针对使用HTML5消息传递的任何应用程序，所以这也适用于所有这些。

Answer 1

我决定深入挖掘一下，并找到了解决这个问题的方法（和原因）。

首先，我使用jsbeutifier（http://jsbeautifier.org/）以更易读的格式获取代码。该错误来自一个名为D的函数。此函数被添加为HTML5消息监听器的处理程序：

    window.addEventListener ? window.addEventListener("message", parseMessage, !1) : window.attachEvent("onmessage", parseMessage);

（我已将D重命名为parseMessage）

接下来，如果查看D（parseMessage）函数，我们会看到代码尝试解析消息而不检查原点。

问题是，Facebook还向“消息”处理程序发送消息！如果您打印出所有消息，您可以看到这一点，所有错误实际上都是SC api试图解析Facebook消息！

解决方法是在解析消息之前检查原点（如Opera HTML5开发站点中所述：http://dev.opera.com/articles/view/window-postmessage-messagechannel/）

这是固定的“D”功能：

function D(a) {
        var b, c, d, e;

        if(a.origin == 'http://w.soundcloud.com'){
            try {
                c = JSON.parse(a.data)
            } catch (f) {
                console.log(f);
            }

            b = y(a.source);
            d = c.method;
            e = c.value;
            d === i.READY && (b ? (b.isReady = !0, C(b, k), v(k, b)) : m.push(a.source));
            if (!b || a.origin !== b.domain) return !1;
            var g = [];
            e !== undefined && g.push(e), C(b, d, g)
        }
    }

或整个未经验证的解决方案：http://jsfiddle.net/6uREk/1/

感谢 Ť

Answer 2

找到了解决方案！

只需加载soundcloud api asyc延迟，没有任何错误将eccour .. （奇怪的错误BTW：/）

<script>
setTimeout(function(){

(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "http://w.soundcloud.com/player/api.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'sc'));
},2000);

(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/all.js#xfbml=1&appId=137624476258287";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>

Soundcloud HTML5 API无法与Facebook JS一起使用

2 个答案: