本文讲的是有了 Docker，用 JavaScript 框架开发的 Web 站点也能很好地支持网络爬虫的内容抓取， 【编者的话】Prerender 服务能够为网络爬虫提供预先渲染的动态页面内容，解决了用 JavaScript 框架构建的 Web 站点不支持爬虫抓取的问题。本文详细描述了一种解决方案，尤其是提供了集成 Prerender 服务的 Docker 容器镜像。 如果你正在使用 AngularJS 构建一个面向大众消费者的应用，你肯定希望用户能把它分享到社交媒体上。对于特定的应用而言，丰富的社交分享差不多是最重要的营销渠道。所谓「丰富的社交分享」，是指像下面这样的分享： 可以看到， Facebook, Twitter 等社交站点能够获取非常丰富的内容，不仅限于网页标题和图片。为什么可以做到这一点？因为在网页 HTML 文档的 head 部分包含了有特别含义的元数据标记。像 Facebook 以及 Pinterest 和 Google+ 等社交站点能读取遵循 标准的元数据，例如，
Twitter 也支持类似的机制，不过它用的元数据属性前缀是 twitter: ，而不是 og: 。 当用户在社交站点上分享一个 URL 时，社交站点会启动一个网络爬虫去抓取该页面的内容。网络爬虫首先在网页源文档中找出各种元数据标记，然后才会查看常规 HTML 元素的内容，例如， <head> 标记和网页中的图像等。 用 AngularJS（以及其它 JavaScript 框架）开发的 Web 站点不支持爬虫的抓取
我已经在 站点的网页中添加了所有必需的遵循开放图协议标准的元数据标记。但是，当我把 Earlyclaim 站点的一个链接分享到 Facebook 时，显示的结果却是非常令人失望的： 导致如此糟糕的结果的原因很简单： 抓取网页时，网络爬虫并不会执行网页中的 JavaScript 代码。 因此，爬虫抓取到的内容是这样的：
解决方案
解决方案的基本思想是：应用一种在服务器端执行的用户代理探测方法，识别出当前请求来自于社交站点的爬虫；此时，服务器不会像处理浏览器请求那样返回一个 AngularJS 模板文件，而是重定向到一个服务器端生成的页面，页面中包含了希望提供的元数据标记以及正确填写的信息。 经过 Google 搜索，以及与其它创业公司 的技术人员的讨论，我们发现了 服务，它能够预先渲染好动态页面的内容。这为问题的解决奠定了良好的开端。 Prerender 的开发者提供了很多 ， 还把 开源，因为他们认为 我们相信搜索引擎优化（SEO）是一种权利，而非一种特权！
当然，如果你愿意，也可以付费使用他们提供的 Prerender 托管服务。 支撑 的基础设施是以 为基础构建的。为了集成 Prerender 服务，我们首先在 Docker Hub 中找出相关的几个容器镜像，然后进行试用，结果难以令人感到满意。 我们的需求包括： - 完全可定制的环境（通过 ）；
- 能够使用 作为缓存数据库；
- 立即可用的 Prerender 容器。
这些也是我们自行构建容器镜像的原因！ 为什么公开我们的解决方案
首先，我们信仰「协同智能」： 协同智能是多主体、分布式系统的特征，其中每个主体（人或者机器）都有唯一的位置，自主地为问题解决网络作贡献。在生态系统中，有机体的协同自治使得演化成为可能。在自然生态系统中，每个有机体的唯一标识来自于自身的基因、环境以及它在生态系统中的行为和位置。自然生态系统为设计下一代社交网络提供原则，使之能够支持协同智能、众包个人的专长、偏好以及在问题解决过程中的独特贡献。 - 摘自
我们的解决方案是建立在开源的 的基础之上：没有它，就不会有我们的解决方案。 Prerender 团队太棒了。 其次，同样重要的是，在与很多创业公司的开发者交流之后，我们了解到：他们很多人都在使用 AngularJS 或者其它框架构建 Web 应用，也需要解决搜索引擎优化/丰富的社交分享问题。然而，由于不知道解决方法，或者感觉解决起来太耗费时间，或许会影响更为重要的产品发布时间，他们暂时搁置这个问题，留待以后解决。还有些开发者甚至没有意识到有这个问题，当从我们这里听说了之后，他们请求我们把解决方案分享出来。 我们相信这个方案能够加速整个开发进程，因为它解决了一个普遍的问题。很高兴能够分享这个方案。 实现
如果技术人员想把我们构建的容器镜像添加到自己的基础设施中，请参考 Docker Hub 上的文档： AngularJS 服务
如果是 AngularJS 应用，首先实现下面的代码： 'use strict';!(function (window, document, undefined) {var getModule = function (angular) {return angular.module('seo', []) .run([ '$rootScope', function ($rootScope) { $rootScope.htmlReady = function () { $rootScope.$evalAsync(function () { // fire after $digest setTimeout(function () { // fire after DOM rendering if (typeof window.callPhantom === 'function') { window.callPhantom(); } }, 0); }); }; } ]);};if (typeof define === 'function' && define.amd) {define(['angular'], getModule);} else {getModule(angular);}})(window, document); 然后通过 angular.module('youApp', ['seo']) 调用。 结论
如果你使用我们的容器，觉得还不错，请一定告知我们（ ）。 如果你觉得有人会对此感兴趣，请转发给他们（点击社交分享按钮）！ 任何建议，请发推特并通知 ：非常期待您的观点和文字！ 任何代码改进，请通过 推送合并请求！ 顺便说一句，我们热爱创业公司，我们热爱开发者，我们热爱社区！ 开放生态系统万岁！ 原文： （翻译：柳泉波 校对：佚名） ===================================== 译者介绍 柳泉波，读书喝茶踢球写程序，目前在华南师范大学广东高校计算机网络与信息系统工程中心工作。 本文来自云栖社区合作伙伴DockerOne，了解相关信息可以关注DockerOne。
原文标题：有了 Docker，用 JavaScript 框架开发的 Web 站点也能很好地支持网络爬虫的内容抓取