Question

我一直在阅读关于使ajax繁重的应用程序更适合搜索引擎： https://developers.google.com/webmasters/ajax-crawling/docs/getting-started

我最近提供的解决方案之一在很大程度上依赖于跨域javascript小部件。集成此解决方案的网站将在其网站中包含一段javascript。例如：

<script type="text/javascript">
  var _lw = _lw || {};
  _lw._setAccount = ' 00000000-0000-0000-0000-000000000000' ;
  _lw._widgetType = '_widgetName';
  _lw._options = {};  

  (function() {
    var scriptsrc = document.createElement('script'); 
    scriptsrc.type = 'text/javascript'; 
    scriptsrc.async = true;
    scriptsrc.src = 'http://hostname/Application/js';

    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(scriptsrc, s);
  })();
</script>]

<div id="widget-container"></div>

此请求将dom附加到jQuery包装器以及窗口小部件将使用的相关应用程序URL。注意，这段javascript的来源只是一个asp.net mvc内容结果，它输出相关内容：

[HttpGet]
[ActionName("js")]
public ContentResult RenderJavascript()
{
      // java script urls & jquery wrapper are output
}

现在必要的url可用，刚刚附加的jQuery包装器启动并使用帐户信息，窗口小部件类型和任何相关选项触发对服务器的请求。 ASP.net MVC只是充当内容生成器，它会返回JSONP结果，其中生成的内容会附加到网站内容容器中。

function loadWidget() {
    var jsonpUrl = _opts._widgetUrl + _lw._setAccount;
    jQuery.getJSON(jsonpUrl, _lw._options, function (data) {
        jQuery('#widget-container').html(data.html);
    });
}

我读到的关于使这个过程更加适合搜索引擎的内容越多，我就会失去从哪里开始。然而，生成所需的HTML快照很简单，我如何表示谷歌应该抓取链接？

另一个似乎有点看好的选择是关于如何处理没有散列片段的页面的部分。这可以通过添加使用javascript小部件的元标记来实现。

<meta name="fragment" content="!">

然而，现在的问题在于这是一个跨域请求，并且不会在任何地方引导。

Answer 1

这是一个棘手的问题。 Google会对evidence抓取JavaScript进行抓取（它本身并不像浏览器那样执行它，但它至少会在JavaScript中查找URL，就像在Flash，Word等中一样如果谷歌在您的JavaScript中发现'http://hostname/Application/js'并设计跟随它，然后从返回的JavaScript中解析网址，那么您有可能不需要做任何事情。

如果你想要一个更具体的解决方案，也许可以修改你的代码：

<div id="widget-container"><iframe src="http://hostname/Application/iframe"></div>

OR：

<div id="widget-container"><a href="http://hostname/Application/links"></div>

当您的小部件的JavaScript由浏览器执行时，您可以将#widget-container的内容替换为您通常替换它的内容（您还可以添加style="visibility:invisible;"属性，但我怀疑Google会惩罚“隐藏的“内容尽可能由于显而易见的原因”，但当Googlebot停止时，它会抓取iframe /链接。在服务器端，您可以让这些URL生成与JavaScript相同的链接列表，但是在易于理解的HTML中。

可能使Googlebot更高兴的另一个选项是使用像WebPageElement这样的Schema.org对象，例如：

<div id="widget-container" itemscope itemtype="http://schema.org/SiteNavigationElement">
  <link itemprop="url" href="http://hostname/Application/links">
</div>

...然后让目标页面也包含Schema.org声明。我不确定你是否会从以前的一种形式中获得任何真正的好处，但是metadata is a love note to the future。

创建可抓取的跨域javascript小部件

1 个答案: