2

ここにある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 メッセージングを使用するすべてのアプリケーションでも表示される可能性があるため、これはそれらすべての一般的な修正でもあります。

4

2 に答える 2

7

さて、私はもう少し深く掘り下げることにし、この問題の解決策 (および原因) を見つけました。

まず、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)
        }
    }

または全体の um-ninified ソリューション: http://jsfiddle.net/6uREk/1/

ありがとうT

于 2012-07-02T20:31:52.657 に答える
1

解決策を見つけました！

遅延を伴うsoundcloud api asycをロードするだけで、エラーは発生しません..（奇妙なバグところで:/)

<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>
于 2012-06-19T17:57:02.250 に答える