1

モーダル内に Facebook のようなボタンを設定しようとしていますが、OG メタをモーダル内の各画像に固有にしたいと考えています。私のスクリプトでは、まず必要な OG メタ タグを追加します。

/* INSERT OPEN GRAPH META TAGS */
$('head').append('<meta property="og:title" content="'+x+'"/>
   <meta property="og:url" content="'+window.location.href+'"/>
   <meta property="og:description" content="'+z+'"/>
');

これを確認したところ、問題なく追加されています。この時点では、FB は初期化されていないか、呼び出されていません。特定のモーダルのみにソーシャル アイコンがあるため、モーダルを開くと画像が読み込まれ、ソーシャル アイコンが必要な場合は次のコードが実行され、要素のデータ属性に基づいて OG メタ タグが動的に更新されます。

$('meta[property="og:title"]').attr('content',currentImageParent.data('MetaTitle')); 

$('meta[property="og:description"]').attr('content',currentImageParent.data('MetaDescription'));

これは問題なく動作し、コードで更新が行われていることがわかります。したがって、画像がモーダルに読み込まれ、画像の .data 情報に基づいてメタ タグが更新された後、Facebook SDK を呼び出して、いいね/送信ボタンをセットアップする (そして必要な DIV を追加する) のが安全だと考えました。存在しない場合はそのページに移動します):

$('body').prepend('<div id="fb-root" class="FacebookSDK"></div>
   <script>
   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\'));
   </script>
');

デバッガーではこれは機能せず、デフォルトで非 OG メタ タグ (タイトル/説明) に設定されます。また、og:url などが定義されていないというエラーがスローされます (呼び出す前に追加されていても)。HTML ページにダミーの OG メタ タグを配置してデバッガーを実行すると、エラーは発生せず、OG メタ タグのコンテンツ (動的に更新されるコンテンツではなく、ダミーのコンテンツ テキストのみ) が表示されます。

何か案は？ありがとう！

4

1 に答える 1

0

Facebook のスクレイパーは Javascript を実行しないため、Javascript (または jQuery) を実行する前に、HTML で使用可能なメタタグのみを読み取ることができます。

Open Graph オブジェクトごとに一意の URL が必要です。

于 2012-09-15T12:08:27.800 に答える