この問題の診断と解決に成功しました。
Facebook JavaScript SDK を非同期的にロードするコードは次のとおりです。
(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";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
それを初期化していた私のコードは次のとおりです。
FB.init({
appId: {APP_ID},
status: true,
cookie: true,
xfbml: true,
oauth: true
});
実際には、XFBML の解析を 2 回要求したことに注意してください。1 回は JavaScript SDK のロード時 ( #xfbml=1) で、もう 1 回は初期化時 ( xfbml: true) です。
comment-countこれにより、タグのレンダリングを妨げるエラーが発生します。
解決策は、これら 2 つの宣言のいずれかを削除することです。#xfbml=1読み込み時に XFBML 解析を要求することは推奨されないように思われるため、JavaScript SDK URL の末尾から削除することをお勧めします。
私のローダーは次のようになります。
(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";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
そして、すべてが完璧に機能します。
同期読み込み
JavaScript SDK を同期的にロードする場合は、次のように変更します。
<script src="//connect.facebook.net/en_US/all.js#xfbml=1"></script>
これに:
<script src="//connect.facebook.net/en_US/all.js"></script>