fix(SSR): show console error instead of throw errors for Maximum executing times while fetching axio

Provide some debug info as well

Author: RyanRoll

README.md

@@ -451,7 +451,7 @@ _Each property is optional_
 | ------------------------------- | ----------------------------------------- | --------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------- |
 | cache                           | LRU<String, ReactUseApi.CacheData \| any> | new LRU()                                                 | The cache instance based on lru-cache                                                                                                             |
 | axios                           | AxiosStatic \| AxiosInstance              | axios                                                     | axios instance (http client)                                                                                                                      |
-| maxRequests                     | number                                    | 50                                                        | The maximum of API requests when SSR                                                                                                              |
+| maxRequests                     | number                                    | 100                                                       | The maximum of API requests when SSR                                                                                                              |
 | useCacheData                    | boolean                                   | true                                                      | Set true to inject JS cache data into html when calling `injectSSRHtml()`                                                                         |
 | alwaysUseCache                  | boolean                                   | false                                                     | Set true to use cache data always (equivalent to `options.useCache = true`)                                                                       |
 | clearLastCacheWhenConfigChanges | boolean                                   | true                                                      | This is default behavior that the cached data will be removed once the url config of useApi has been changed. Set false to remain the cached data |

src/__tests__/ssr.test.ts

@@ -14,13 +14,15 @@ jest.mock('../common', () => {
 
 const { feedRequests, injectSSRHtml, loadApiCache } = ssrModule
 const originalLog = console.log
+const originalErrorLog = console.error
 
 beforeEach(() => {
   jest.resetModules()
 })
 
 afterEach(() => {
   console.log = originalLog
+  console.error = originalErrorLog
 })
 
 const copySettings = () => ({
@@ -130,7 +132,7 @@ describe('feedRequests tests', () => {
       0
     )
     expect(console.log).toHaveBeenCalledWith(
-      '[ReactUseApi][Executed times] =',
+      '[ReactUseApi][Executed Times] =',
       1
     )
     expect(ssrHtml).toBe('<div>Hello World!</div>')
@@ -184,7 +186,7 @@ describe('feedRequests tests', () => {
     } = context
     const ssrHtml = await feedRequests(context, '')
     expect(console.log).toHaveBeenCalledWith(
-      '[ReactUseApi][Executed times] =',
+      '[ReactUseApi][Executed Times] =',
       0
     )
     expect(ssrConfigs.length).toBe(0)
@@ -206,8 +208,10 @@ describe('feedRequests tests', () => {
         cacheKey: '',
       },
     ]
-    await expect(feedRequests(context, '', 0)).rejects.toThrow(
-      /Maximum executing times while fetching axios requests/
+    console.error = jest.fn()
+    await feedRequests(context, '', 0)
+    expect(console.error.mock.calls[0][0]).toEqual(
+      '[ReactUseApi][ERROR] - Maximum executing times while fetching axios requests'
     )
   })
 })

src/common.ts

@@ -5,7 +5,7 @@ import LRU from 'lru-cache'
 export const defaultSettings = {
   cache: new LRU<string, ReactUseApi.CacheData | any>(),
   axios: axios as AxiosStatic | AxiosInstance,
-  maxRequests: 50, // max requests count when running ReactDom.renderToString in SSR
+  maxRequests: 100, // max requests count when running ReactDom.renderToString in SSR
   useCacheData: true, // whether to use the cached api data come from server
   alwaysUseCache: false, // whether to use the cached api data always for each api call
   clearLastCacheWhenConfigChanges: true, // clear the last cache data with the last config when the config changes

src/ssr.ts

@@ -14,7 +14,7 @@ export const feedRequests = async (
     if (debug) {
       console.log('[ReactUseApi][Requests Count] =', cacheKeys.size)
       console.log(
-        '[ReactUseApi][Executed times] =',
+        '[ReactUseApi][Executed Times] =',
         settings.maxRequests - maxRequests
       )
     }
@@ -23,7 +23,15 @@ export const feedRequests = async (
   }
   debug && console.log('[ReactUseApi][Collecting Requests]')
   if (maxRequests === 0) {
-    throw new Error('Maximum executing times while fetching axios requests')
+    console.error(
+      '[ReactUseApi][ERROR] - Maximum executing times while fetching axios requests',
+      '[congis]:',
+      ssrConfigs,
+      '[Executed Times]:',
+      settings.maxRequests - maxRequests
+    )
+    cacheKeys.clear()
+    return ssrHtml // done
   }
 
   // The algorithm is collecting the unobtained API request config from the previous renderSSR()
@@ -44,7 +52,7 @@ export const feedRequests = async (
       })
     } catch (error) {
       // is an axios error
-      if (error.response && error.response.data) {
+      if (error?.response?.data) {
         cache.set(cacheKey, {
           // should not be error (Error) object in SSR, it will lead an error: Converting circular structure to JSON
           error: error.response,