动态Facebook的开放图标签可能吗？

我使用jQuery动态更改我的<meta property="og:image" content="#">和<meta property="og:title" content="#">标记（下图）。当我通过Chrome中的“检查”查看代码时，代码已成功更改。动态Facebook的开放图标签可能吗？

HTML：

<meta property="og:title" content="#"> 
<meta property="og:image" content="#">

的jQuery：

$("meta[property='og:title']").attr("content", data.name); 
$("meta[property='og:image']").attr("content", data.thumbnail.url);

但Facebook debugger tool仍呈现content="#"每个。我假设这是因为Facebook在Javascript有机会替换内容之前读取源代码。

有没有办法解决这个问题？

谢谢。

来源

2015-12-15 user1661677

Facebook根本不解析JavaScript，您不能使用动态Open Graph标签。无论如何改变它们并没有意义。

显然，您只能在服务器上动态更改OG标签。例如：https://yourdomain.com/dynamicogtags.php?title=xxx&description=xxx

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

不知道that's你想，虽然做的事，该URL看起来很丑陋的方式。当然，重写会很好。

您也可能想尝试类似prerender.io，但我不确定它是否会处理动态og标记。

来源

2015-12-15 08:37:31 luschn

我已经知道这一点。我的问题是'解决'我的问题。许多网站都这样做 - 必须有一种方法。 – user1661677

有没有办法解决，Facebook只是不解析JavaScript。网站在做什么？ – luschn

我并不是说我需要使用Javascript才能完成此操作。必须有一种方法来动态加载''标签。 Vimeo，Youtube，几乎所有的视频托管网站都像FB一样完美无瑕。我猜他们正在使用PHP为每个上传的视频创建一个新页面？ – user1661677

试试这个对我有用。

<?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://URL/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://URL/img/<?php echo $params['image']; ?>.png"/> 
     <meta property="og:description" content="<?php echo $params['description']; ?>"/> 

    </head> 
</html>

来源

2017-04-03 10:16:52 user7795526

如前所述，Facebook根本不解析JavaScript。

这样做的一种方式（我这样做）是使用prerender.io之类的预渲染服务预渲染页面并将来自Web搜寻器的请求重定向到基于用户代理的预渲染服务器（可以轻松找到如何与你的谷歌Nginx/Apache服务器）。

预渲染服务会生成页面的HTML/CSS渲染，但它们会等到页面完全加载并执行JavaScript之后才执行此操作。这样，Facebook就会得到一个网站的渲染，JavaScript已经被执行，并且OpenGraph标签设置正确！

Prerender是开源的，所以你可以免费运行你自己的prerender服务器！

来源

2018-02-21 15:19:38

动态Facebook的开放图标签可能吗？

回答

相关问题