Question

我的网站上有一个分享按钮（图片）。单击时，以下js将创建共享预览：

window.open('https://www.facebook.com/sharer/sharer.php?u=www.mysite.com/thepage/', 'facebook-share-dialog', 'width=626,height=436');

第一次在页面上单击“共享”按钮时，预览为空白。它甚至不显示网址。如果共享窗口关闭，并且第二次单击“共享”按钮，则它可以正常工作。

这些页面是用户生成的，因此无法浏览每个页面并确保每个页面都被点击一次，也不能将每个页面都通过点击。

Answer 1

我遇到了同样的问题，并在Facebook的文档中找到了解决方案：

使用og：image：width和og：image：height打开Graph标签

使用这些标记会将图像指定给爬虫，以便它可以   立即渲染它而不必异步。

只需确保您的打开图表标记包含宽度和高度，以及图像源。您的元标记应如下所示：

<meta property="og:image" content="...image.jpg" />
<meta property="og:image:width" content="500" />
<meta property="og:image:height" content="600" />

Answer 2

Becouse sharer.php 有点笨拙并且已弃用。我建议使用 FB.ui 。当然，您必须在developers.facebook.com

上创建应用

window.fbAsyncInit = function() {
        FB.init({
            appId      : "xxxxxxx", // App ID
            channelUrl : "YOURDOMAIN/channel.html", // Channel File
            status     : true, // check login status
            cookie     : true, // enable cookies to allow the server to access the session
            xfbml      : true  // parse XFBML
        });
};
function isEmpty(obj) {
    for(var prop in obj) {
        if(obj.hasOwnProperty(prop))
            return false;
    }
    return true;
}

// Load the SDK Asynchronously
(function(d){
        var js, id = "facebook-jssdk", ref = d.getElementsByTagName("script")[0];
        if (d.getElementById(id)) {return;}
        js = d.createElement("script"); js.id = id; js.async = true;
        js.src = "//connect.facebook.net/en_US/all.js";
        ref.parentNode.insertBefore(js, ref);
}(document));

function shareOnWall()
{   
    FB.ui({
        method: "feed",
        link: "www.mysite.com/thepage/", //your site
        picture: "www.mysite.com/thepage/images/someimage.png",
        name: "Some Name",
        caption: "blah blah",
        description: "Message"
    }, shareCallback);
}

function shareCallback(response)
{
    //share was successful
}

这是代码，祝你好运。 ;）

Facebook分享：首次点击共享预览窗口为空

2 个答案: