4

我正在尝试将我的 Meteor 应用程序与 Facebook Open Graph 集成，以在时间线中发布操作。

Facebook API 通过在 HTML 头中定义对象特定的元标记来工作，这些元标记将由 API 读取。例如：

<head prefix="og: http://ogp.me/ns# [YOUR_APP_NAMESPACE]: 
                     http://ogp.me/ns/apps/[YOUR_APP_NAMESPACE]#">
    <title>OG Tutorial App</title>
    <meta property="fb:app_id" content="[YOUR_APP_ID]" /> 
    <meta property="og:type" content="[YOUR_APP_NAMESPACE]:recipe" /> 
    <meta property="og:title" content="Stuffed Cookies" /> 
    <meta property="og:image" content="http://fbwerks.com:8000/zhen/cookie.jpg" /> 
    <meta property="og:description" content="The Turducken of Cookies" /> 
    <meta property="og:url" content="http://fbwerks.com:8000/zhen/cookie.html">
</head>

然而，在检查任何 URL 时，Facebook API 看到的是这样的：

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="/ed99236548322b46a7562b49cd6ee0e0f059e506.css">
  <script type="text/javascript" src="/c16ff21884b1f831d91ebf271236ef78b03b552e.js"></script>
  <title>Made with Meteor!</title>
</head>
<body>
</body>
</html>

在 Meteor 应用程序中集成此元标记的最佳方式是什么，这可能会根据 URL 发生变化？

4

3 回答 3

5

我遇到了同样的问题。

处理这个问题的两种方法：

  • 最近添加到“spiderable”包（目前在“devel”分支中）还允许您更改客户端代码中的“head”标签（附加您的 og:title 等），并从您的“神奇”服务到 Facebook服务器。

（注意：您可能不需要在此解决方案中使用autopublish 包，因为“spiderable”会停止页面呈现，同时依赖于在客户端启动时“autopublish”设置为“true”的标志）

  • 一个更轻量级的解决方案是 Meteor 的“headly”包：

https://github.com/ayal/headly

安装后，您可以像这样使用它：

Meteor.headly.config({tagsForRequest: function(req) {
  ... do something dynamic here, i.e get title from db based on url param ...
  return '<meta property="og:title" content="<DYNAMIC TITLE>" />';
}});
于 2012-10-19T09:19:28.577 回答
1

可蜘蛛包是要走的路...

在你的路由器中做这样的事情......（这是coffee-sciprt）

#Spiderable stuff to set meta tags for crawl
$("meta[property='fb:app_id']").attr "content", "YOUR_APP_ID"
$("meta[property='og:type']").attr "content", "YOUR_APP:OPEN_GRAPH_CUSTOM_EVENT"
$("meta[property='og:url']").attr "content", "https://apps.facebook.com/YOURAPP"+ @canonicalPath
$("meta[property='og:title']").attr "content", "some title:
$("meta[property='og:description']").attr "content", "some description"
$("meta[property='og:image']").attr "content", "thumb image url"

你可以测试看看这个页面的 Facebook 抓取是否正在使用他们的调试工具......只需输入这个页面的 URL 并检查错误等。

https://developers.facebook.com/tools/debug

于 2013-09-06T15:44:10.083 回答
0

你需要meteor add spiderable。

从流星 0.4.2 开始，在spiderable包含该包的情况下，您所要做的就是<meta>在客户端 HTML 中包含相关元素<head>。

<head>
  <meta property="og:type" content="website" />
  <title>HTML head test</title>
</head>
于 2012-10-08T12:02:15.767 回答