如何在聚合物中设置动态元标记和开放图标记

How to set dynamic Meta Tags and Open Graph tags in polymer?

本文关键字:图标 动态 聚合物 设置      更新时间:2023-09-26

我有一个聚合物节点站点,我一直在处理它,但不知道如何包含动态元标记和Open Graph标记。Jquery不起作用,也不会使用聚合物api来添加节点,因为它会在页面加载后添加所有标签,而facebook将无法读取标签。谷歌爬虫确实会渲染页面,但最好我能在标题中设置描述。

<html>
  <head>
    <meta name="description" content="description goes here" />
    <meta property="og:title" content="title"/>
  </head>
  <body>
    <group-pages id="grouppages" is="dom-bind"></group-pages>
  </body>
</html>

grouppages设置数据并使用服务根据url填充页面,但我找不到如何根据页面更改元标记。

有人有什么想法吗?

一个想法是获得信息服务器端并将其发送到聚合物,但我仍然不确定节点和聚合物之间是否可能。

这绝对是一个悬而未决的问题,它涉及在客户端生成元标签的任何方式,无论是Polymer还是任何其他前端代码。

只有当爬虫执行JS时,它才能被克服。2014年5月,谷歌开始这样做。另一方面,据我所知,Facebook还没有朝着这个方向发展。

你可能想看看其他两个答案来获得完整的图片:

  • https://stackoverflow.com/a/16485238/570016
  • https://stackoverflow.com/a/25421037/570016

到目前为止,唯一100%可靠的方法是服务器在发送响应之前拦截爬网程序并专门为其呈现内容。这也是knwon作为同构JavaScript。已经有一些有用的工具可以支持这样的任务,比如预渲染。

希望这能有所帮助!干杯

如果您使用Firebase托管Polymer应用程序,则可以使用Firebase http触发器函数预呈现index.html文件。

exports.host = functions.https.onRequest((req, res) => {
  // replace og-tags in the index.html file and return it
});

请参阅这篇文章了解更多信息。