为搜索引擎爬行的 AngularJS 应用程序创建 HTML 快照

Question

首先让我告诉你我想做什么。

我想索引我用 Angular JS 制作的网站，为此我已经阅读了谷歌的所有文档或文章。

我发现的是：

我需要使用 html5Mode 或 hashbag 模式将我的 Angular js url 转换为友好的 url。

喜欢：http://www.example.com/#/about 到 http://www.example.com/#!/about 或只是 http://www.example.com/about

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

所以当任何爬虫出现在我的网站上时，会说Googlebot 会出现，它会将我的网址视为http://www.example.com/?_escaped_fragment_=/about，所以现在我需要将此请求提供给静态 html 页面......对吗？？

p>

现在我的问题是 我如何使用 php 框架生成这个 html 静态页面，并且只有在其内容完全加载后才会自动创建这个 html 意味着如果 angular js 正在使用 $http 请求加载数据，那么这个 html 只会在所有数据加载到 html 模板后生成。

只有当它可以自动生成时，我才能将此 html 提供给爬虫。

我已经通过手动创建一些 html 页面在本地进行了测试，并检查了请求是否带有 _escaped_fragment_ 参数，那么它将为该特定的静态 html 页面提供服务。

但我无法找到方法，我将使用 php 框架为特定的 Angular js 请求创建 html 页面。

我不想使用任何npm 服务。我想在php 和/或任何jQuery Plugin 中完全创建它。

Answer 1

除了需要将转义的片段请求重定向到的服务器之外，服务器在呈现各种视图后拍摄 HTML 快照，然后可以将其提供给 Googlebot 等，别忘了你还需要现有 Web 服务器（例如 Apache 或 IIS）中的设置，用于重定向到处理转义片段的新服务器。

感谢您正在寻找 PHP 解决方案，并且不想使用像 prerender 或 seoserver 包这样的 NPM 解决方案，但我想以您的方式提出另一种更简单的解决方案：使用现有的托管解决方案，例如改为https://www.seo4ajax.com/ 或https://prerender.io/。他们将为您托管一个可以抓取您的网站的 SEO 服务器，并且通常这是免费的，除非您拥有一个拥有数百页以上的庞大数据驱动网站。为您减少负载，无需再运行另一台服务器，并且您可以获得一些不错的管理面板来查看爬虫已命中 SEO 重定向等。

一般来说，您需要在您提到的 HTML 中使用元标记，以及在您的 AngularJS 配置中进行这些设置：

$locationProvider.html5Mode(true);
$locationProvider.hashPrefix('!');

如果您现有的服务器是 Apache，然后是一些自定义重定向设置，例如在 .htaccess 文件中，这些站点将为您提供，您可以复制和粘贴。