ssr服务端渲染项目集成GrowingIO

GrowingIO简称gio,下文中以gio代替GrowingIO

gio的集成需要在index.html中引入sdk(即一段动态加载gio.js的代码),sdk中用到了window、document等BOM属性,此时就会遇到node渲染失败问题

第一时间会想到《braft-editor服务端渲染下报错document is not defined》文章中的解决方案–dynamic按需加载

确实按需加载是需要的,但是仅靠按需加载并不能解决sdk的报错

分析:dynamic加载的是组件,但是gio的sdk需要在html中加载

集成方式:

1、将gio的初始化封装成GioInit组件,组件中涉及环境判断,会用到BOM属性

2、在服务端文件如server.js中对渲染的html进行拼接,在尾部加入gio的sdk代码(之所以能这么做,是因为script标签放到html标签外部仍可执行)

本例以koa实现,其他框架找到对应位置追加sdk代码即可,黄色框为sdk代码ssr服务端渲染项目集成GrowingIO