feat(core): sSR - render cache - added a parameter for ctx

cmux · Feb 25, 2021 · b9575d9 · b9575d9
1 parent 533ff92
commit b9575d9
Show file tree

Hide file tree

Showing 4 changed files with 25 additions and 12 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -22,14 +22,18 @@
 -   **新特性**
     -   现已支持全新的 _JSX_ 转译引擎 ([#282](https://github.com/cmux/koot/issues/282))
         -   该功能对从 0.15 之前版本升级而来的项目默认关闭，如需开启请参阅[升级指南](https://koot.js.org/#/migration/0.14-to-0.15)
+        -   使用 `koot-cli` 创建的新项目会使用该新特性
         -   相关信息请查阅 [React 官方文档](https://reactjs.org/blog/2020/09/22/introducing-the-new-jsx-transform.html)
     -   **新配置项** `beforeBuild` - 生命周期方法: 打包即将开始时 ([#288](https://github.com/cmux/koot/issues/288))
         -   详情请参见文档 [生命周期](https://koot.js.org/#/life-cycle?id=打包)
     -   **新配置项** `afterBuild` - 生命周期方法: 打包刚刚完成时 ([#288](https://github.com/cmux/koot/issues/288))
         -   详情请参见文档 [生命周期](https://koot.js.org/#/life-cycle?id=打包)
 -   优化
     -   `serviceWorker` 的 `cacheFirst` `networkFirst` `networkOnly` 扩展缓存策略选项，其数组 (`Array`) 内现在可以直接传入正则表达式和用以分析请求的函数，请参见文档 [Service Worker/扩展缓存规则](/pwa?id=扩展缓存规则)
-    -   SPA 项目打包结果中附带的简易服务器现在支持 `serverBefore` 和 `serverAfter` 生命周期 ([#292](https://github.com/cmux/koot/issues/292))
+    -   SSR 项目
+        -   渲染缓存的 `get` 和 `set` 方法现在均新增一个参数，值为本次请求的 _KOA Context_ ([#294](https://github.com/cmux/koot/issues/294))
+    -   SPA 项目
+        -   打包结果中附带的简易服务器现在支持 `serverBefore` 和 `serverAfter` 生命周期 ([#292](https://github.com/cmux/koot/issues/292))
 -   添加依赖包
     -   `cli-table`
     -   `filesize`

diff --git a/docs/config.md b/docs/config.md
@@ -544,24 +544,26 @@ module.exports = {
      *           每条结果最多保存时间, 单位: 毫秒 (ms)
      * @property {number} [maxCount=50]
      *           根据 URL 保留的结果条目数
-     * @property {(url)=>string|boolean} [get]
+     * @property {(url,ctx)=>string|boolean} [get]
      *           自定义缓存检查与吐出方法。存在时, maxAge 和 maxCount 设置将被忽略
      *           参数 url - 请求的完整的 URL
+     *           参数 ctx - 本次请求的 KOA Context
      *           返回 false 时，表示该 URL 没有缓存结果
-     * @property {(url,html)=>void} [set]
+     * @property {(url,html,ctx)=>void} [set]
      *           自定义缓存存储方法。存在时, maxAge 和 maxCount 设置将被忽略
      *           参数 url - 请求的完整的 URL
      *           参数 html - 服务器渲染结果
+     *           参数 ctx - 本次请求的 KOA Context
      */
     renderCache: {
         maxAge: 5000,
         maxCount: 50,
-        get: (url) => {
+        get: (url, ctx) => {
             // 自实现的缓存结果获取逻辑
             // return false
             return '完整渲染结果';
         },
-        set: (url, html) => {
+        set: (url, html, ctx) => {
             // 自实现的缓存结果存储逻辑
         },
     },

diff --git a/packages/koot/ReactApp/server/middlewares/isomorphic/index.js b/packages/koot/ReactApp/server/middlewares/isomorphic/index.js
@@ -151,7 +151,9 @@ const middlewareIsomorphic = (options = {}) => {
             const thisRenderCache = renderCacheMap
                 ? renderCacheMap.get(LocaleId)
                 : undefined;
-            const cached = thisRenderCache ? thisRenderCache.get(url) : false;
+            const cached = thisRenderCache
+                ? thisRenderCache.get(url, ctx)
+                : false;
             if (!__DEV__ && cached !== false) {
                 ctx.body = cached;
                 renderComplete();
@@ -255,7 +257,7 @@ const middlewareIsomorphic = (options = {}) => {
 
             if (result.body) {
                 // HTML 结果暂存入缓存
-                if (thisRenderCache) thisRenderCache.set(url, result.body);
+                if (thisRenderCache) thisRenderCache.set(url, result.body, ctx);
                 ctx.body = result.body;
                 renderComplete();
                 return;

diff --git a/packages/koot/ReactApp/server/render-cache.js b/packages/koot/ReactApp/server/render-cache.js
@@ -2,14 +2,16 @@
  * @callback cacheGet
  * 缓存检查与吐出方法
  * @param {String} url
+ * @param {Object} ctx KOA Context
  * @return {Boolean|String} 对该 URL 不使用缓存时返回 false，使用时返回缓存结果 String
  */
 
 /**
  * @callback cacheSet
  * 缓存存储方法
  * @param {String} url
- * @param {String} html
+ * @param {String} html SSR 渲染结果 HTML
+ * @param {Object} ctx KOA Context
  */
 
 const defaults = require('../../defaults/render-cache');
@@ -48,10 +50,12 @@ class KootReactRenderCache {
     /**
      * 缓存检查与吐出方法
      * @param {String} url
+     * @param {Object} ctx KOA Context
      * @return {Boolean|String} 对该 URL 不使用缓存时返回 false，使用时返回缓存结果 String
      */
-    get(url) {
-        if (typeof this.customGet === 'function') return this.customGet(url);
+    get(url, ctx) {
+        if (typeof this.customGet === 'function')
+            return this.customGet(url, ctx);
 
         // 没有该条结果，直接返回 false
         if (!this.list.has(url)) return false;
@@ -75,10 +79,11 @@ class KootReactRenderCache {
      * 缓存存储方法
      * @param {String} url
      * @param {String} html
+     * @param {Object} ctx KOA Context
      */
-    set(url, html) {
+    set(url, html, ctx) {
         if (typeof this.customSet === 'function')
-            return this.customSet(url, html);
+            return this.customSet(url, html, ctx);
 
         // 如果当前已缓存的 URL 数量不少于设定的最大数量
         // 移除已缓存列表里的第一条结果