动态生成Facebook Open Graph元标记

时间:2011-12-08 13:26:22

标签: php facebook facebook-opengraph meta-tags

正如标题暗示我正在尝试动态生成Facebook Open Graph元标记,但我无法使其正常工作。甚至可能吗?

更新:

最后,我在@saccharine的帮助下完成了它。以下代码对我有用:

<?php

$params = array();
if(count($_GET) > 0) {
    $params = $_GET;
} else {
    $params = $_POST;
}
// defaults
if($params['type'] == "") $params['type'] = "restaurant";
if($params['locale'] == "") $params['locale'] = "en_US";
if($params['title'] == "") $params['title'] = "default title";
if($params['image'] == "") $params['image'] = "thumb";
if($params['description'] == "") $params['description'] = "default description";

?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
    <head prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb# MY_APP_NAME_SPACE: http://ogp.me/ns/fb/MY_APP_NAME_SPACE#">
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>

        <!-- Open Graph meta tags -->
        <meta property="fb:app_id" content="MY_APP_ID" />
        <meta property="og:site_name" content="meta site name"/>
        <meta property="og:url" content="http://mysite.com/index.php?type=<?php echo $params['type']; ?>&locale=<?php echo $params['locale']; ?>&title=<?php echo $params['title']; ?>&image=<?php echo $params['image']; ?>&description=<?php echo $params['description']; ?>"/>
        <meta property="og:type" content="MY_APP_NAME_SPACE:<?php echo $params['type']; ?>"/>
        <meta property="og:locale" content="<?php echo $params['locale']; ?>"/>
        <meta property="og:title" content="<?php echo $params['title']; ?>"/>
        <meta property="og:image" content="http://mysite.com/img/<?php echo $params['image']; ?>.png"/>
        <meta property="og:description" content="<?php echo $params['description']; ?>"/>

    </head>
</html>

我现在放入Facebook调试器的网址现在可以包含任何动态参数,甚至不包括任何动态参数,全部或仅包含选择,以及任何顺序如下:
http://mysite.com/index.php?type=restaurant&title=luigis
或者这个:
http://mysite.com/index.php?locale=de_DE&description=hi&type=bistro

完成后:我现在可以将动作发布到用户的流:

function postRestaurant() {
    FB.api('me/MY_APP_NAMESPACE:have_lunch?\
    start_time=2000-12-12T04:00:00&\
    expires_in=7200&\
    restaurant=' + encodeURIComponent(getRedirectURI() + '?type=restaurant' + '&description=arnold' + '&title=stalone'), 'post', function (response) {
        if (!response || response.error) {
            console.log('postRestaurant: Error occured => ' + response.error.message);
        } else {
            console.log('postRestaurant: Post was successful! Action ID: ' + response.id);
        }
    });
}

像魅力一样! :]

5 个答案:

答案 0 :(得分:31)

首先,我想重申,我几乎肯定你的问题是由于你传入调试器的url不是动态生成的。 url标记基本上充当重定向器。除非它是完全相同的(意味着url元对象上的元标记与您传入的网址上的元标记相同)作为您正在测试的网址,否则您将无法获得您正在寻找的结果。

元标记

<meta property="og:url"> 

需要动态生成。调试器被重定向到您的默认索引页而不是动态生成的页面。

例如,我为我正在使用的每个对象分配一个id,所以我有类似下面的内容

<meta property="og:url" content="http://example.com/index.php?id=<?php echo $_GET['id'] ?>"/> 

我将确切的url传入调试器,因此调试器所在的最后一页将是那个确切的URL。

另外,在下面的

<meta property="og:type" content=""/>

如何动态生成属性?您是否记得在实际代码中设置如下内容?

<meta property="og:type" content="<?php echo $_GET['type'] ?>"/>

你似乎也把所有东西推到了网址中,这很危险并且可能引起巨大的麻烦,这可能是这里的问题。相反,只推一件事,例如?type = bistro,然后从DB传播必要的数据。

我建议基于object_id动态生成大多数OG标记。存储每个object_id的相关OG信息,然后在访问时传播它们。这样,您还可以轻松扩展和编辑OG更新时使用的标记。

如果你遇到OG问题,你应该毫不犹豫地将它们作为新问题而不是评论发布,因为我保证其他人也会遇到同样的问题。

答案 1 :(得分:4)

我相当肯定Facebook不再使用参数抓取任何网址。它始终&#34;重定向&#34;到网址的剥离版本。

在OPs示例中:

http://example.com/index.php?type=restaurant&title=luigis

变为

http://example.com/index.php

无论你做什么。我最常见的解释是this

A URL with no session id or extraneous parameters. All shares on Facebook will use this as the identifying URL for this article.

答案 2 :(得分:2)

是的,像魅力一样,但需要一些重新编码。我必须创建一个这样的新页面:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
    <head prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb# MY_APP_NAME_SPACE: http://ogp.me/ns/fb/MY_APP_NAME_SPACE#">
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>

        <!-- Open Graph meta tags -->
        <meta property="og:title" content="<?= urldecode($_GET['title']) ?>" />
        <meta property="og:type" content="article" />
        <meta property="og:url" content="<?= "http://www.calsots.com".$_SERVER['REQUEST_URI']; ?>" />
        <meta property="og:image" content="<?= $_GET['image'] ?>" />
        <meta property="og:site_name" content="Calsots.com" />
        <meta property="fb:admins" content="MY_APP_ID" />
        <meta property="og:description" content="<?= urldecode($_GET['description']) ?>" />

    </head>
</html>

答案 3 :(得分:1)

当您单击对象类型中的“获取代码”链接时,您是否尝试粘贴它给您的代码?
我会尝试粘贴到您的网站,然后如果它有效,则复制html输出。
尝试不使用DOCTYPE标签。
下面是我得到的样本,我上面没有看到这些标签:fb:app_id,不确定它是否有所作为。
另外,og:url也不应该包含最后的变量吗?

&lt; head prefix =“og:http://ogp.me/ns# fb:http://ogp.me/ns/fb#网站:http://ogp.me/ns/website#”&gt;
  &lt; meta property =“fb:app_id”content =“1234567888”&gt;
  &lt; meta property =“og:url”content =“http://mysite.com/index.php?type=MY_APP_NAMESPACE%3Abistro”&gt;

答案 4 :(得分:0)

对于Joomla Open Graph Meta动态:

<meta property="og:title" content="<?=
$title = $this->getTitle();
?>" />
        <meta property="og:type" content="website" />
        <meta property="og:url" content="<?= "http://YORUWEBSITE.com".$_SERVER['REQUEST_URI']; ?>" />
        <meta property="og:image" content="http://YOURWEBSITE.com/images/stories/BIGIMAGE.jpg" />
        <meta property="og:site_name" content="YOURWEBSITE.com" />
        <meta property="fb:app_id" content="YOURFACEBOOKAPPIDNUMBER" />
        <meta property="og:description" content="<?= $title = $this->getDescription(); ?>" />