13

我正在尝试将 Facebook 分享按钮集成到我雇主的网站,标题、网址、描述/介绍都正确显示,但是没有附加图像。当共享对话框打开时,图像容器会闪烁然后消失,好像 facebook 正在尝试处理图像但失败了。

我正在使用 og:image 和链接关系来尝试指定要用于共享链接的图像:

<meta property="og:image" content="/images/logo_white_150px.png" />
<link rel="image_src" type="image/png" href="/images/logo_white_150px.png" />

该图像曾经可以工作(它已适当缩放)但不再有效,我还尝试了其他不同大小和格式的图像,但没有运气。

这是我在标题中使用的开放元标记:

<!DOCTYPE html>
<html xmlns:fb="http://ogp.me/ns/fb#" itemscope itemtype="http://schema.org/Article" xmlns:og="http://ogp.me/ns#">
  <head>    
    <meta property="og:type" content="landing page" />
    <meta property="og:title" content="Social Media Test Page" />
    <meta property="og:description" content="This is a page for testing the behavior of social media buttons..." />
    <meta property="og:image" content="/images/logo_white_150px.png" />
    <link rel="image_src" type="image/png" href="/images/logo_white_150px.png" />
    <meta property="og:image:type" content="image/png" />
    <meta property="og:url" content="<%=shortUrl%>" />
    <meta property="og:site_name" content="site name" />
    <meta property="og:medium" content="mult" />
  </head>

这是我在正文开头使用的 JavaScript:

  <body>
    <script type="text/javascript">
      (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>
  ...

这是我使用按钮的方式:

  <div class="left" style="text-align: center;">
    <a name="fb_share" type="button" share_url="<%=shortUrl%>">Share</a>
    <script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script>
  </div>

非常感谢任何帮助,在此先感
谢克里斯。

4

3 回答 3

1

如果抓取结果一切正常,请尝试使用Facebook Debugger获取新的抓取信息。

这是因为 Facebook 使用自己的 og:data 缓存。

于 2016-01-06T14:34:17.240 回答
0

在没有看到您的代码的 HTML 输出的情况下,我只能猜测这个问题。不要使用类似的相对 url <%=shortUrl%>,但一定要使用完全限定的 Url.... 上面有 http(s):// 的东西。

此外, http: //developers.facebook.com/docs/share/表示此共享按钮已被弃用。请改用“赞”按钮:http: //developers.facebook.com/docs/reference/plugins/like/

于 2012-01-11T05:08:46.847 回答
0

在我的经验中 :

  • 所有的 URL 都应该是绝对的(即使是 og:image 值)
  • 如果您的图像通过 https 提供同等服务,则您应该添加一个带有绝对 url 的 og:image:secure_url 元属性(如果您只通过 https 提供所有内容,则可以跳过此步骤)
  • 添加以及 og:image:width 和 og:image:height 元属性

主 url 重定向非常棘手,您应该绝对确保您的内容正确(并且完全)获取,对于复杂的动态内容,我经常最终在 .htaccess 中进行检测以提供 FB 的爬虫适当的内容,如下所示:

RewriteEngine On
RewriteCond %{HTTP_USER_AGENT} facebookexternalhit/[0-9]
RewriteRule ^(.*)$ OG_GENERATOR_SCRIPT_HERE.php [L,QSA]
于 2016-12-28T11:59:32.940 回答