FB共享SDK无法正常工作 - 仅显示股票应用程序照片

时间:2016-07-10 19:47:05

标签: javascript php facebook facebook-javascript-sdk share

我使用以下代码在FB上分享我的页面。数据标题,数据描述和数据图像不共享。弹出对话框链接时,FB仅显示应用程序默认照片。共享时,href正确共享,并显示应用程序默认照片。

代码在下面,我也粘贴在脚本底部(带有og标签)。那里有冲突吗? FB无法读取我的php标签吗?

感谢任何帮助。

HTML:

<li><div id="fb-root"></div>
<a class="fb_share" href="<?php echo JO_Request::getInstance()->getFullUrl(); ?>"  data-image="" data-title="<?php echo $this->mypage['postTitle']; ?>" data-desc="<?php echo $this->mypage['postDesc'] ? nl2br(substr($this->mypage['postDesc'], 0, 200)) . '...' : ''; ?>" data-width="450"><img src="https://www.mygoodness.com/date/myimage.png" alt="" width="20" height="20"></a></li>

脚本:

<script type="text/javascript">

    window.fbAsyncInit = function() {
        FB.init({
            appId: 'app id',
            secret: 'app secret',
            status: true,
            cookie: true,
            xfbml: true
        });
    };

    (function(d, debug)
    {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" + (debug ? "/debug" : "") + ".js";
        ref.parentNode.insertBefore(js, ref);
    }(document, /*debug*/ false));

    function postToFeed(title, desc, url, image) {
        FB.XFBML.parse();
        var obj = {method: 'feed',link: url, picture: image,name: title,description: desc};
        function callback(response) {}
        FB.ui(obj, callback);
    }

    var fbShareBtn = document.querySelector('.fb_share');
    fbShareBtn.addEventListener('click', function(e) {
        e.preventDefault();
        var title = fbShareBtn.getAttribute('data-title'),
            desc = fbShareBtn.getAttribute('data-desc'),
            url = fbShareBtn.getAttribute('href'),
            image = fbShareBtn.getAttribute('data-image');
        postToFeed(title, desc, url, image);

        return false;
    });

</script>

头:

<head prefix="og:http://ogp.me/ns# fb:http://ogp.me/ns/fb#">

    <!-- Meta -->
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=echo,chrome=1">

    <meta property="fb:app_id" content="app id">
    <meta property="og:url" content="<?php echo JO_Request::getInstance()->getFullUrl(); ?>">
    <meta property="og:title" content="<?php echo $this->mypage['postTitle']; ?>">
    <meta property="og:image" content="<?php echo $this->baseUrl;?>myhome.png">
    <meta property="og:type" content="website">
    <meta property="og:description" content="<?php echo $this->mypage['postDesc'] ? nl2br(substr($this->mypage['postDesc'], 0, 200)) . '...' : ''; ?>">

</head>

1 个答案:

答案 0 :(得分:0)

实际上你的标签已经正确实现了,问题是你设置在共享对话框中显示的图像会在开放空间图中设置限制。 (最大限制-8mb)

可以实现网络的开放图形标签的捷克文档 Sharing Open Graph Webmaster Guide

您还可以使用此调试器检查您的链接是否为开放图,我认为您最有用。 Sharing Debugger