Facebook 抓取工具不加载动态元标签 [英] Facebook scraper doesn't load dynamic meta-tags
问题描述
我正在使用下面的函数 (GWT) 动态创建 HTML 元标记.在 DOM 上拥有这个需要 1 秒钟.除了 Facebook 之外，它运行良好.当我从我的网络分享链接时，抓取工具会获取 HTML 中的元标记:none.我该如何解决这个问题?
I am creating the HTML meta-tags dynamically using the function below (GWT). It takes 1 second to have this on the DOM. It is working fine except for Facebook. When I share a link from my web, the scraper gets the meta-tags that are in the HTML: none. How can I fix this?
/**
* Include the HTML attributes: title, description and keywords (meta tags)
*/
private void createHTMLheader(MyClass thing) {
String title=thing.getTitle();
String description=thing.getDescription();
Document.get().setTitle(title);
MetaElement metaDesc = Document.get().createMetaElement();
metaDesc.setName("description");
metaDesc.setContent(description);
NodeList<Element> nodes = Document.get().getElementsByTagName("head");
nodes.getItem(0).appendChild(metaDesc);
}
这是 DOM 上的结果 HEAD.标题 aaaa 和元描述已动态加载.(感谢CBroe 的提示).在查看源代码"功能中，不会显示这些动态标签(仅在开发者工具 - 查看 dom 上).
This is the resulting HEAD on the DOM. The title aaaa and meta-description has been loaded dynamically. (Thanks CBroe for the tip). In the "view source" functionality, these dynamic tags are not displayed (only on developer tools - view dom).
<head>
<title>aaaa</title>
<meta content="text/html; charset=utf-8" http-equiv="content-type">
<meta name="description" content="My description">
<script language="javascript" type="text/javascript" src="dialective/dialective.nocache.js"></script><script defer="defer">dialective.onInjectionDone('dialective')</script>
</head>
原始 HTML 没有 TITLE 或 META-DESCRIPTION 标签.
The original HTML doesn't have a TITLE or META-DESCRIPTION tags.
推荐答案
Facebook 抓取工具只能看到来自服务器的原始 HTML 响应中包含的 标签.运行任何 JavaScript 代码、Flash 插件、Java 小程序或任何其他成熟的浏览器可能运行的东西都不够聪明".
The Facebook scraper can only see <meta> tags included in the original HTML response from the server. It's not "smart enough" to run any JavaScript code, Flash plugins, Java applets, or anything else that a full-fledged browser might run.
您需要使用服务器端框架在服务器上生成这些 标记.
You'll need to generate these <meta> tags on the server using a server side framework.
此外，Facebook 提供了一个方便的测试工具，以确保您的页面公开适当的元标记.您可能还需要添加 OpenGraph 标签，例如 og:title 和 og:description.
Also, Facebook provides a handy testing tool to make sure your page exposes the appropriate meta tags. You might need to add OpenGraph tags as well, such as og:title and og:description.
这篇关于Facebook 抓取工具不加载动态元标签的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
