web-dev-qa-db-fra.com

Génération dynamique de balises META Facebook Open Graph

Comme le titre l'indique, j'essaie de générer dynamiquement des balises META Facebook Open Graph, mais je ne peux pas le faire fonctionner. Est-ce même possible?

MISE À JOUR:

Enfin, je l'ai fait fonctionner avec l'aide de @saccharine. Le code suivant fonctionne pour moi:

<?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>

L'URL que je mets dans le débogueur Facebook maintenant peut inclure n'importe lequel des paramètres dynamiques ou même aucun, tout ou seulement une sélection et dans n'importe quel ordre comme ceci:
http://mysite.com/index.php?type=restaurant&title=luigis
ou ca:
http://mysite.com/index.php?locale=de_DE&description=hi&type=bistro

Cela fait: je peux maintenant publier des actions dans le flux de l'utilisateur:

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);
        }
    });
}

Fonctionne comme un charme! :]

phpfacebookfacebook-opengraphmeta-tags
51
borisdiakur

Tout d'abord, je tiens à répéter que je suis presque certain que votre problème est dû au fait que l'URL que vous passez dans le débogueur n'est pas générée dynamiquement. La balise url agit essentiellement comme un redirecteur. À moins que ce ne soit exactement le même (ce qui signifie que les balises META sur le méta-objet URL sont les mêmes que celles sur l'URL que vous transmettez) que l'URL que vous testez, vous n'obtiendrez pas les résultats que vous recherchez.

La balise META

<meta property="og:url">

doit être généré dynamiquement. Le débogueur est redirigé vers votre page d'index par défaut au lieu de la page générée dynamiquement.

Par exemple, j'attribue un identifiant à chaque objet que j'utilise, et j'ai donc quelque chose comme le suivant

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

Je passe cette URL exacte dans le débogueur, et donc la dernière page sur laquelle le débogueur atterrira sera cette URL exacte.

Aussi, dans ce qui suit

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

comment la propriété est-elle générée dynamiquement? Avez-vous pensé à définir dans votre code réel quelque chose comme ceci?

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

Vous semblez également tout mettre dans l'url, ce qui est dangereux et peut provoquer d'énormes maux de tête, ce qui pourrait être le problème ici. Au lieu de cela, bousculez une seule chose, par exemple? Type = bistro, puis propagez les données nécessaires à partir de la base de données.

Je recommanderais de générer dynamiquement la plupart des balises OG en fonction d'un object_id. Stockez les informations OG pertinentes pour chaque object_id, puis propagez-les lorsque vous y accédez. De cette façon, vous pouvez également facilement développer et modifier les balises que vous utilisez lorsque OG est mis à jour.

Si vous avez des problèmes avec OG, n'hésitez pas à les poster en tant que nouvelles questions au lieu de commentaires car je garantis que d'autres personnes ont également le même problème.

31
saccharine

Je suis à peu près certain que Facebook n'explore plus aucune URL avec des paramètres. Il "redirige" toujours vers une version supprimée de l'URL.

Dans l'exemple OP:

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

devient

http://example.com/index.php

peu importe ce que vous faites. La chose la plus proche que j'ai vue pour une explication est ceci :

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

Oui, fonctionne comme un charme, mais a besoin d'un recodage pour moi. J'ai dû créer une nouvelle page comme celle-ci:

<!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>
2
Oscar Pascual

Lorsque vous cliquez sur le lien Obtenir le code dans vos types d'objet, avez-vous essayé de coller le code qu'il vous a fourni?
J'essaierais de coller sur votre site Web, puis si cela fonctionne, répliquer la sortie html.
Essayez-le sans la balise DOCTYPE.
Voici un échantillon de ce que j'ai obtenu, et je ne vois pas ces balises ci-dessus: fb: app_id, je ne sais pas si cela fait une différence.
De plus, l'og: url ne devrait-elle pas également inclure les variables à la fin?

<head prefix = "og: http://ogp.me/ns# fb: http://ogp.me/ns/fb# site Web: http://ogp.me/ns/website# ">
<meta property = "fb: app_id" content = "1234567888">
<meta property = "og: url" content = "http://mysite.com/index.php?type=MY_APP_NAMESPACE%3Abistro">

1
Joao B

Pour Joomla Open Graph Meta dynamic:

<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(); ?>" />
0
MilosK