我正在编写一个网站，其中包含多个页面（由用户提交）。这些页面可以通过类似http://www.mywebsite.com/?page=page1，http://www.mywebsite.com/?page=page2等的方式访问。我想为每个页面添加一个类似于FB的分享按钮（在内容加载后），以便当他们点击该按钮时，它会在他们的FB上发布该特定页面（以及其图像）。到目前为止，一切都很顺利，直到我遇到了这个问题，让我头疼了两天。有些论坛说open-graph和fb-share存在漏洞，但我仍然希望我的需求是全球通用的，并且必须正常工作。
虽然fb-like和fb-share在共享特定URL方面表现良好，但它们没有选择正确的图像。我可以在头部定义OG元标记，但由于页面通过Ajax动态加载，这些标记可能会发生变化。
我通过jQuery覆盖这些标记og:url和og:image(显示已更新)，但我认为fb-share没有读取它们。（或者我该如何测试？）
由于我使用ajax方法，FB调试器工具似乎没有太大帮助，它不显示更新的元标记，而是显示我在头部定义的内容，所以它对我没有太大帮助。如果我在头部硬编码我的值（不依赖于jQuery进行覆盖），那么我的两个页面都可以正常工作，并显示正确的内容、计数和URL，这证实了缓存、标记或我使用的图像都没有问题。但是当我将它们全部组合起来通过JavaScript进行覆盖时，似乎存在断开连接的情况，不确定出现在哪里。
根据我的理解，这是使用jQuery覆盖元标记的问题。此外，我认为fb-share在显示旁边的计数时也没有选择正确的URL。
简而言之，fb-share没有使用新的URL进行覆盖（根据我显示的页面ID），因为它显示所有页面的相同计数（like/share），并且它没有选择覆盖的元标记来显示正确的图片。任何我硬编码的内容都只适用于硬编码的页面。
我的index.php运行如下（请注意，我已经掩盖了网站详细信息和我的FB应用程序）。
虽然fb-like和fb-share在共享特定URL方面表现良好，但它们没有选择正确的图像。我可以在头部定义OG元标记，但由于页面通过Ajax动态加载，这些标记可能会发生变化。
我通过jQuery覆盖这些标记og:url和og:image(显示已更新)，但我认为fb-share没有读取它们。（或者我该如何测试？）
由于我使用ajax方法，FB调试器工具似乎没有太大帮助，它不显示更新的元标记，而是显示我在头部定义的内容，所以它对我没有太大帮助。如果我在头部硬编码我的值（不依赖于jQuery进行覆盖），那么我的两个页面都可以正常工作，并显示正确的内容、计数和URL，这证实了缓存、标记或我使用的图像都没有问题。但是当我将它们全部组合起来通过JavaScript进行覆盖时，似乎存在断开连接的情况，不确定出现在哪里。
根据我的理解，这是使用jQuery覆盖元标记的问题。此外，我认为fb-share在显示旁边的计数时也没有选择正确的URL。
简而言之，fb-share没有使用新的URL进行覆盖（根据我显示的页面ID），因为它显示所有页面的相同计数（like/share），并且它没有选择覆盖的元标记来显示正确的图片。任何我硬编码的内容都只适用于硬编码的页面。
我的index.php运行如下（请注意，我已经掩盖了网站详细信息和我的FB应用程序）。
<head>
...
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="robots" content="noarchive"/>
<meta name="GOOGLEBOT" content="noarchive"/>
<meta property="fb:app_id" content="4126120410011204"/>
<meta property="fb:admins" content="fbuser1"/>
<meta property="fb:admins" content="fbuser2"/>
<meta property="og:title" content="MYWEBSITE | A website on cloud being tested..."/>
…
</head>
<script>
$( document ).ready(function() {
…
var selProfID = $("#profileID").val();
if (selfProfID ) {
showOneProf(selfProfID);
}
function showOneProf(uid) {
...
$.ajax({
type: "POST",
url: action.php,
data: {'pageid' : uid},
success: function(results)
{
..
$.each(eval(results), function(i,item){
…
$('head').append('<meta property="og:url" content="http://www.mywebsite.com/?page='+item.pageid+'" />');
$('head').append('<meta property="og:image" content="http://www.mywebsite.com/uploads/'+item.image+'" />');
var linkurl = "http://www.mywebsite.com/?page=page1";
document.getElementById('fblike2').setAttribute('href', linkurl);
document.getElementById("fbcomments1").setAttribute('href', linkurl);
FB.XFBML.parse(document.getElementById('fbc'));
$("#contents").append(results);
});
..
});
</script>
<?php
..
$profid = $_GET['page'];
echo "<input type='hidden' id='profileID' value='$profid'><BR>";
..
<div id='contents'>
<div id="fbc"></div>
<script>
function loadfbComments(){
var elemDiv = document.getElementById("fbc");
var likes = '<div id="fblike2" class="fb-like" data-href="http://www.mywebsite.com" data-layout="button" data-action="like" data-send="true" data-show-faces="true" data-share="true"></div>';
var markup = '';
markup += '<div id="fbcomments1" class="fb-comments" data-colorscheme="light" data-href="http://www.mywebsite.com" data-order-by="reverse" data-num-posts="10" data-width="682" style="margin-top:2em;"></div>';
elemDiv.innerHTML = "<BR>" + likes + "<BR>" + markup;
FB.XFBML.parse(elemDiv);
}
loadfbComments();
</script>
<script type="text/javascript" src = "//connect.facebook.net/en_US/all.js#xfbml=1&appId=09090909090909"></script>
..
</div>
?>
如果您认为我在这里犯了任何愚蠢的错误，请帮忙指正。非常感谢。
PK