Facebook刮板不加载动态元标记 [英] Facebook scraper doesn't load dynamic meta-tags

查看:270
本文介绍了Facebook刮板不加载动态元标记的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在使用以下功能动态创建HTML元标记(GWT)。在DOM上需要1秒钟的时间。除了Facebook以外,它工作正常。当我从我的网页上分享一个链接时,刮刀会获取HTML中的元标记:none。如何解决这个问题?

  / ** 
*包含HTML属性:标题,描述和关键字标签)
* /
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)。

 头> 
< title> aaaa< / title>
< meta content =text / html; charset = utf-8http-equiv =content-type>
< meta name =descriptioncontent =我的描述>

< script language =javascripttype =text / javascriptsrc =dialective / dialective.nocache.js>< / script>< script defer =defer> ; dialective.onInjectionDone( 'dialective')< /脚本>

< / head>

原始HTML没有TITLE或META-DESCRIPTION标签。

解决方案

Facebook刮板只能看到原始HTML响应中包含的< meta> 服务器。运行任何JavaScript代码,Flash插件,Java小程序或其他任何可能运行的完整浏览器的功能并不足够。



您需要使用服务器端框架在服务器上生成这些< meta> 标签。



此外,Facebook提供了一个方便测试工具,以确保您的网页公开适当的元标记。您可能还需要添加OpenGraph标签,例如 og:title og:description


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

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>

The original HTML doesn't have a TITLE or META-DESCRIPTION tags.

解决方案

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.

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屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆