Facebook-共享鏈接無法正常工作-Javascript / jQuery

Question

我已經實現了一個Facebook分享鏈接，但是注意到正在發布的內容與在Facebook彈出窗口中所顯示的不一樣。 標題和描述在實際帖子中丟失，但顯示在彈出預覽中。 所發布的只是消息和鏈接。 在此處輸入圖片說明

 $('body').on('click', '.social_media a', function(e) {

                var loc = $(this).attr('href');
                var action = $(this).attr('data-action');
                var title = $(this).attr('data-title');
                var desc = $(this).attr('data-desc');
                var img = $(this).attr('data-img');

    window.open('https://www.facebook.com/sharer/sharer.php?s=100&p[url]=' + encodeURIComponent(loc) + '&p[images][0]&p[title]=' + encodeURIComponent(title) + '&p[summary]=' + encodeURIComponent(desc), 'sharer', 'status=0,width=626,height=436, top=' + ($(window).height() / 2 - 225) + ', left=' + ($(window).width() / 2 - 313) + ', toolbar=0, location=0, menubar=0, directories=0, scrollbars=0');
});

誰能看到我在做什么錯？

Answer 1

我建議您使用元標記，而不是將參數傳遞給彈出窗口。 將這些標簽插入您要共享的頁面的head ：

<meta property="og:url" content="http://domain/url" />
<meta property="og:title" content="Your title" /> 
<meta property="og:description" content="Description" />
<meta property="og:image" content="http://image1" />
<meta property="og:image" content="http://image2" />

FB將對其進行解析並顯示在對話框中。 通過這種方式，您還可以指定多個圖像。

然后使用以下代碼打開此對話框窗口：

var width = 626;
var height = 436;
var yourPageToShare = $(this).attr('href');
var sharerUrl = 'https://www.facebook.com/sharer/sharer.php?u=' + encodeURIComponent(yourPageToShare);
var l = window.screenX + (window.outerWidth - width) / 2;
var t = window.screenY + (window.outerHeight - height) / 2;
var winProps = ['width='+width,'height='+height,'left='+l,'top='+t,'status=no','resizable=yes','toolbar=no','menubar=no','scrollbars=yes'].join(',');
var win = window.open(sharerUrl, 'fbShareWin', winProps);

在這里您可以閱讀有關Facebook Open Graph標簽的更多信息

編輯

這是應該起作用的完整頁面代碼：

<!DOCTYPE html>
<html>
<head>
<meta property="og:title" content="Your title" /> 
<meta property="og:description" content="Your description" />
<script>
function share() {
    var width = 626;
    var height = 436;
    var yourPageToShare = location.href;
    var sharerUrl = 'https://www.facebook.com/sharer/sharer.php?u=' + encodeURIComponent(yourPageToShare);
    var l = window.screenX + (window.outerWidth - width) / 2;
    var t = window.screenY + (window.outerHeight - height) / 2;
    var winProps = ['width='+width,'height='+height,'left='+l,'top='+t,'status=no','resizable=yes','toolbar=no','menubar=no','scrollbars=yes'].join(',');
    var win = window.open(sharerUrl, 'fbShareWin', winProps);
}
</script>
</head>
<body>

    <input type="button" value="Share" onclick="share();">

</body>
</html>

值得注意的是，FB可能會緩存該頁面的meta標簽，因此您可能需要等待一段時間。

您遇到的問題可能是因為您將元標記添加到了包含鏈接的頁面，而不是這些鏈接指向的頁面。

Facebook-共享鏈接無法正常工作-Javascript / jQuery

問題描述

1 個解決方案

解決方案1
1 已采納 2014-01-14 15:43:19

Facebook-共享鏈接無法正常工作-Javascript / jQuery

問題描述

1 個解決方案

解決方案1 1 已采納 2014-01-14 15:43:19

解決方案1
1 已采納 2014-01-14 15:43:19