与pushstate SEO的可追溯的javascript温泉

时间:2013-12-17 11:28:03

标签: javascript seo

我制作单页应用程序。我读过以下文章create-crawlable-pushstate。 我使用hashbang运行问题。这似乎对我来说就像一个解决方案。但我不太确定我是否会在那里发生什么。以下是文章中的一个例子:

// We're using jQuery functions to make our lives loads easier
$('nav a').click(function(e) {
      url = $(this).attr("href");

      //This function would get content from the server and insert it into the id="content" element
      $.getJSON("content.php", {contentid : url},function (data) {
            $("#content").html(data);
      });

      //This is where we update the address bar with the 'url' parameter
      window.history.pushState('object', 'New Title', url);

      //This stops the browser from actually following the link
      e.preventDefault();
}

这很棒,但google将如何知道内容可用。 getJson函数是异步的,因此在加载内容之前将推送状态。我的想法是,我在加载内容后调用pushstate来显示链接已准备就绪。

  1. 在我的场景中,用户点击了一个href。
  2. 路由器捕获哈希更改并调用函数。 (我可以在生成内容后将click事件覆盖到pushstate。
  3. 将加载和生成内容。 (时间通过)

1 个答案:

答案 0 :(得分:2)

Google并不关心JavaScript。它只看到了URL。

您的服务器仍需要为每个给定的URL生成适当的页面。

使用JS:

  1. 客户端(浏览器,googlebot,等等)要求http://example.com/whatever/whatever/whatever
  2. 服务器使用/whatever/whatever/whatever
  3. 的页面进行响应
  4. 客户点击链接:
    • href="/something/something/something
    • Ajax</li> <li> preventDefault`
  5. 客户端使用Ajax加载内容
  6. 客户端将网址更改为/something/something/something,而不重新加载整个页面
  7. 没有JS:

    1. 客户端(浏览器,googlebot,等等)要求http://example.com/whatever/whatever/whatever
    2. 服务器使用/whatever/whatever/whatever
    3. 的页面进行响应
    4. 客户点击链接:
      • href="/something/something/something
      • Ajax</li> <li> preventDefault`
    5. 客户转到/something/something/something(因为没有JS可以触发preventDefault
    6. 之后,有人直接前往/something/something/something,同样适用。服务器直接提供/something/something/something的内容。然后当点击链接时(如果JS可用),JS会执行Ajax。