基于headless-chrome的通用服务端渲染方案

chrome-render

基于Headless chrome的高性能，通用服务器渲染，可在服务器中渲染任何SPA（浏览器中的渲染数据）以进行SEO或其余优化。

使用

1. 从npm安装它 npm i chrome-render
2. new a ChromeRender then use it to render a web page, a ChromeRender means a chrome.

const ChromeRender = require('chrome-render');
// ChromeRender.new() return a Promise, you can use async function in this way:
// const chromeRender = await ChromeRender.new(); 
ChromeRender.new({}).then(async(chromeRender)=>{
    const htmlString = await chromeRender.render({
       url: 'http://qq.com',
    });
});  
复制代码

一个chromeRender实例能够调用render多时间和并发的高频率使用状况。 chromeRender将一个选项卡池管理为render多页并发。

3. 在再也不须要chromeRender以后，您应该调用await chromeRender.destroyRender()kill chrome add释放全部资源。

API

ChromeRender.new() 方法支持选项：

• maxTab：numbermax chrome chrome将打开以渲染页面，默认值是无限制，maxTab用于避免过多的chrome致使chrome崩溃。ChromeRender将建立一个选项卡轮询以重用选项卡，以提升性能并减小资源，由于chrome中的打开和关闭选项卡须要时间，例如数据库链接轮询。
• chromeRunnerOptions：object与chrome-runner的选项相同，能够配置chrome的启动选项，详细信息请参阅chrome-runner的选项

chromeRender.render() 方法支持选项：

• url：string是必填项，网页的URL
• cookies：object {cookieName:cookieValue}是一个可选参数。在请求网页时设置HTTP cookie
• headers：object {headerName:headerValue}是一个可选参数。在请求网页时添加HTTP标头
• useReady：boolean是否window.isPageReady=1已准备好用于通知chrome-render页面。默认为false chrome-render使用，domContentEventFired由于页面已准备就绪。
• script：string是一个可选参数。注入脚本源以评估页面什么时候加载
• renderTimeout：number以毫秒为单位，render()若是html字符串以后没法解析，则会引起错误renderTimeout，默认值为5000ms。
• deviceMetricsOverride：object为响应型网站覆盖设备屏幕尺寸的值，详细用法请参见此处
• clearTab：boolean若是true渲染chrome实例以后将导航about:blank到可用资源。默认值为true。设置为false渲染同一网站时可能会提升页面加载速度。

chrome-render的全部请求都将带有HTTP标头 x-chrome-render:${version} 学习下来 受益不浅

手动艾特做者 @浩麟 大佬