12

我正在使用 Angular.js 构建单页应用程序,我的问题是如何使应用程序可抓取,因为路由是在客户端使用 ng-view 处理的,而服务器只返回简单的头文件。

网站链接:http: //india-elections.in/

4

5 回答 5

5

我知道的唯一可行的解​​决方案是核心 AngularJS 团队用于其文档网站的解决方案。

  • 首先,他们将 HTML5 历史记录用于 URL,并使用 hashbang 进行后备。带有 hashbang 的 URL 使 Google_escaped_fragment_在查询字符串中抓取它们。
  • 然后他们在后端使用 AngularJS 字符串插值和指令来呈现模板,因为当用户加载页面并且 AngularJS 解析它时它们将在 DOM 中。
  • 他们将其传递给谷歌,因此他们在搜索索引中的内容与用户浏览器中的内容相同(所以这不是伪装)。

AngularJS Google 小组的核心开发人员提到了这一点。[1] [2] [3]

同样从那里的其他线程中,我认为他们正在使用 PhantomJS 和 NodeJS 来解析页面。

[1] https://groups.google.com/d/msg/angular/yClOeqR5DGc/4YXGx9z8EpAJ

[2] https://groups.google.com/d/msg/angular/EGwg49uAmMI/j-kj9nytT-IJ

[3] https://groups.google.com/d/msg/angular/EGwg49uAmMI/j-kj9nytT-IJ

于 2013-04-04T07:55:30.493 回答
5

我使用以上所有点和以下链接在我的网站中实现了抓取 https://developers.google.com/webmasters/ajax-crawling/

http://www.yearofmoo.com/2012/11/angularjs-and-seo.html

http://india-elections.in

使用 PhantomJs 创建静态模板

于 2013-04-04T18:12:46.720 回答
2

我遇到了这项可能值得一试的服务。它运行一个 PhantomJS 服务器并为您完成所有的工作。

于 2013-06-25T14:43:08.810 回答
1

制作单页应用程序可抓取但具有交互性并不是一项简单的任务。您必须从 UX 角度考虑允许后退按钮和跳转访问的访问点。例如,当按下后退按钮时,需要在服务器上重新创建对象状态的标记,而无需用户交互生成与访问该接入点的使用在客户端上创建的相同的标记。Phantom.js 可用于此任务,或者客户端/服务器不可知的 js 可用于在两端运行,或者像在良好的 php 时代一样,可以重写复制接入点状态的整个逻辑服务器。@Ajay Beniwal 详细介绍了一些有关如何创建 html 快照的链接。

假设您有一个网络服务器,可以在给定特定对象状态的情况下抛出引导标记。可以通过状态标识符提供状态,这需要是使您的代码可抓取的 url。Angular js 和 Backbone.js 等库提供了 Backbone.Router 等机制,后者又使用链接片段或 HTML5 pushState() 方法将状态标识符存储在客户端上。然而,HTML5 的美妙之处在于,刷新直接调用服务器的正确对象状态,而无需加载解析提供的哈希并重定向到正确的对象状态 url 的初始页面,但对于旧的没有其他选项浏览器,围绕 HTML5 范式构建您的应用程序将使它们成为爬虫的蛋糕,以及大多数 HTML5 pushState 的实现,例如 Backbone。

于 2014-03-12T01:28:00.013 回答
0

自 2015 年 10 月以来,您无需执行任何操作即可使您的应用程序可抓取(我假设您指的是 Google 抓取)。

检查这篇文章:

https://webmasters.googleblog.com/2015/10/deprecating-our-ajax-crawling-scheme.html

于 2016-10-22T14:55:55.343 回答