README

静态渲染是一个应用程序，它对您的Webiny React应用程序进行服务器端渲染，并生成静态HTML快照。

当机器人访问网站时，应用程序才会启动，并且仅在网站处于生产模式下才有效。

此应用程序背后的原因

我们使用基于React的平台Webiny来构建网站以及Web应用程序。对于Web应用程序来说这并不重要，但对于网站来说，它们能够被机器人和其他爬虫正确索引是非常重要的。

谷歌声称其机器人可以读取和执行JavaScript，这是真的，但只是部分如此。有一些限制，这些限制没有文档记录，我们也不确定它们具体是什么。但我们知道确实存在一些限制，因为一些页面没有被正确索引或根本未索引，这对我们和我们的客户来说都很糟糕。

构建此应用程序的另一个原因是，其他搜索引擎，如必应、雅虎、百度、DuckDuckGo等，它们根本不执行JS。最后，在Facebook或Twitter上分享JS页面也不起作用。

依赖关系

这是一个Webiny应用程序，这意味着您需要将Webiny平台作为您网站的基础来使用此应用程序。要了解更多关于Webiny的信息，请访问http://www.webiny.com/

此外，您还需要以下项目

• Node 7或更高版本
• PhantomJs 2.1.1或更高版本

PhantomJs 2.5.0

在撰写此文件时，Phantom 2.5.0-beta已发布。从该版本开始，PhantomJs支持ES6，因此我们直接跳上了beta版本。由于我们使用webpack转换JS，因此版本2.1.1也足以正确渲染页面。

安装2.5.0-beta需要几个步骤，如果您正在运行Ubuntu（如我们的Vagrant虚拟机），以下是您需要执行的步骤

1. 从以下链接下载二进制文件：https://bitbucket.org/ariya/phantomjs/downloads/

解压缩归档文件

tar -zxvf {archive name here}

运行安装脚本（并更新路径以匹配您下载的版本）

sudo add-apt-repository ppa:ubuntu-toolchain-r/test

sudo apt-get update

sudo apt-get install libstdc++6 libwebp-dev libhyphen-dev libicu-dev gcc-4.9 g++-4.9

sudo mv phantomjs-2.5.0-beta-ubuntu-trusty /usr/local/share/

sudo ln -sf /usr/local/share/phantomjs-2.5.0-beta-ubuntu-trusty/bin/phantomjs /usr/bin

sudo chmod +x /usr/local/share/phantomjs-2.5.0-beta-ubuntu-trusty/bin/phantomjs

phantomjs --version

配置

应用程序有几个配置参数。以下是一个示例配置和下面的说明

StaticRender:
    Settings:
        ResourceTimeout: 1000
        CacheTtl: 86400
        PathToPhantomJs: '/usr/bin/phantomjs'
        PathToNode: '/home/vagrant/.nvm/versions/node/v7.7.1/bin/node'

ResourceTimeout 定义在获取DOM快照之前等待多长时间。如果您发现某些组件没有加载，请尝试增加该数字。数字以毫秒为单位。

CacheTtl 一旦创建快照，它将被缓存，此数字定义了缓存时间。数字以秒为单位。

PathToPhantomJs 这是PhantomJs可执行文件的路径。如果您使用上一节中的步骤安装了PhantomJs，则可以将路径设置为示例配置中的值。

PathToNode 这是您的node可执行文件的路径。如果您对node安装进行了几次更新，应用程序可能会运行较旧的node版本，具体取决于您的路径设置。通过强制指定node应用程序的特定路径，您可以确保使用最新的node版本执行命令。

功能

应用程序还具有用户界面。通过Webiny管理界面，您可以使用该界面访问其他功能。这些功能包括

• 所有缓存的URL列表
• 删除特定缓存条目的选项
• 强制刷新特定缓存条目
• 查看特定缓存条目的渲染HTML内容
• 使用Fetch as bot查看作为机器人请求的URL的输出

许可证和贡献

贡献 > 随意发送PR。

许可证 > MIT